3
这是我的代码。出于某种原因,它画的线大多是灰色的。Canvas strokeStyle不可靠更改?
即使我的绘图调用实际上没有重叠,看起来似乎有一些线条是用两个笔划样式在彼此之上绘制的。一些线条是白色的,内部灰色。我的白线比我的灰线厚,显然它画了两条线。画布绘制调用异步或什么?
任何想法为什么?
for (var i=0; i<minor_lanes.length; i++) {
connect(minor_lanes[i], "#333", 3);
}
for (var i=0; i<major_lanes.length; i++) {
connect(major_lanes[i], "#fff", 4);
}
for (var i=0; i<limited_lanes.length; i++) {
connect(limited_lanes[i], "#FFFF99", 2);
}
function connect(id, color, width) {
if (!id) {
return;
}
ctx.lineWidth = width;
ctx.strokeStyle = color;
$('#' + id).each(function() {
var laneX = parseInt($(this).css('left')) + $(this).width()/2;
var laneY = parseInt($(this).css('top')) + $(this).height()/2;
ctx.moveTo(x,y);
ctx.lineTo(laneX, laneY);
ctx.stroke();
});
}
这做到了。所以我只是建立一条线路。画布上的文档非常稀疏。谢谢您的帮助。 – Joren
如果你不知道[这个页面],那么“令人沮丧的稀疏”(http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html)另外, 'beginPath()'实际上会影响当前路径 - 'closePath()'基本上将'lineTo()'添加到最后一个子路径的开始位置,然后在该位置启动一个新的子路径。 – ellisbben