在画布上为线条着色

【问题标题】：coloring a line on canvas在画布上为线条着色
【发布时间】：2013-04-03 20:22:44
【问题描述】：

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

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();

【问题讨论】：

我没有看到任何尝试在此处为线条着色。你做了一个吗？
canvas.fillStyle ="red";
在哪里？请在代码中include它。
编辑您的帖子并将所有代码放入其中。

标签： javascript colors html5-canvas lines

【解决方案1】：

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

canvas=getElementById("mycanvas");

context.getContext("2d");

几点： 1. 使用 context.beginPath() 开始 1 次或多次绘制； 2.当你将上下文告诉context.stroke()时，它会使用你设置的last 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();

【讨论】：