javascript - 在画布上为线条着色

Question

我正在尝试为以下线条着色，但我的画布要么为所有线条着色，要么根本不着色。任何帮助，将不胜感激

canvas.save();
canvas.scale(1, 0.75);
canvas.beginPath();
canvas.arc(100, 95, 8, 0, Math.PI * 2, false);
canvas.stroke();
canvas.strokeStyle= "red";
canvas.closePath();
canvas.restore();

Answer 1

您正在使用画布，我假设您的意思是上下文。

canvas=getElementById("mycanvas");

context.getContext("2d");

几点： 1. 用context.beginPath()开始1次或多次draw；2. 当您将上下文告知 context.stroke() 时，它将使用您设置的最后一个strokeStyle（之前的 strokeStyles 被忽略） 3. 总是给 context.stroke() 以将您绘制的线条、弧线等物理应用到画布上.

// draw a red circle
context.beginPath();
context.arc(100, 95, 8, 0, Math.PI * 2, false);
context.strokeStyle="red";
context.stroke();

//then begin a new path and draw a blue circle
context.beginPath();
context.arc(150, 95, 8, 0, Math.PI * 2, false);
context.strokeStyle="blue";
context.stroke();