选中填充选项,最终汇出的图形是以填充+描边呈现的
以下是前端代码
<label for="ColorFill">填充颜色</label>
<input type="color" id="ColorFill">
<label for="ColorStroke">描边/直线颜色</label>
<input type="color" id="ColorStroke">
<select id="shape">
<option value="arc">圆形</option>
<option value="line">直线</option>
<option value="ric">矩形</option>
<option value="erase">橡皮擦</option>
</select>
<select id="ty">
<option value="fill">填充</option>
<option value="stroke">描边</option>
</select>
<label for="Cx" >直线粗细:</label>
<input type="number" id="Cx" value="25" >
<input type="button" value="清空" id="clear">
以下是绘制矩形代码
case "ric":
{
ctx.beginPath();
if(ys == 'fill')
{
ctx.fillStyle=fillC;
ctx.fillRect(x,y,endX-x,endY-y);
}
else(ys == 'stroke')
{
ctx.strokeStyle=strokeC;
ctx.lineWidth=lineW;
ctx.strokeRect(x,y,endX-x,endY-y);
}
ctx.closePath();
break;
}
运行结果及报错内容
我想要达到的结果
就描边的是描边 填充的是填充的