画布strokeStyle不能可靠地改变? [英] Canvas strokeStyle not reliably changing?

查看:299
本文介绍了画布strokeStyle不能可靠地改变?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这是我的代码。出于某种原因,它绘制的线条主要是灰色。

Here's my code. For some reason it draws the lines in mostly grey.

看起来有些线条是用两种笔触样式绘制在一起的,尽管我的绘制调用实际上并没有重叠。一些线是白色的,内部灰色。我的白线比我的灰线厚,所以显然它画的是两条线。画布绘制调用是异步还是什么?

It would appear that some of the lines are being drawn with two stroke styles on top of each other, even though my draw calls don't actually overlap. Some of the lines are white with inner grey. My white lines are thicker than my grey ones so obviously it's drawing two lines. Are canvas draw calls asynchronous or something?

知道为什么吗?

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


推荐答案

我想你忘记了

ctx.beginPath();
// draw path
// stroke
ctx.closePath();

这篇关于画布strokeStyle不能可靠地改变?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆