Вот мой код. По некоторым причинам он рисует линии в основном серым цветом.
Может показаться, что некоторые линии рисуются двумя стилями обводки друг над другом, хотя мои вызовы отрисовки на самом деле не перекрываются. Некоторые из линий белого цвета с внутренним серым. Мои белые линии толще моих серых, поэтому очевидно, что они рисуют две линии. Вызовы Canvas Draw асинхронны или что-то в этом роде?
Есть идеи, почему?
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();
});
}