Question

我有js业余画家，并希望以这种方式工作： - 点击位置（x1，y1） - 点击位置（x2，y2） - 点击位置（x3，y3）

然后我有按钮连接和程序连接最后一个点与第一个，我得到一些内容，我可以用颜色填充它。

ctx.beginPath();
ctx.moveTo(50,50);
ctx.lineTo(100,100);
ctx.lineTo(70, 150);
ctx.lineTo(50, 50);
ctx.fillStyle = "000";
ctx.fill();

这很好但我想按照我想要的方式使用按钮连接线路：

x = event.pageX - $("#myCanvas").offset().left;
y = event.pageY - $("#myCanvas").offset().top;
if (n == 0) {
    a = x;
    b = y;
    zx = x;
    zy = y;
}
ctx.beginPath();
ctx.moveTo(a,b);
if(n != 0)
    ctx.lineTo(x,y);
ctx.stroke();
a = x;
b = y;
n = 1;

向下我有关闭线的功能（连接第一个和最后一个连接线）。

 jQuery('#connect').click(function () {
    if ((this.id == 'connect') && (
        //ctx.beginPath();
        ctx.moveTo(a, b);
        ctx.lineTo(zx, zy);
        //ctx.closePath();
        ctx.fillStyle = bpolnila.toString();
        ctx.fill();
        ctx.stroke();
    }
});

这里出了什么问题我尝试了很多，但我的连线只是不想填充颜色。

Answer 1

我曾经创建了一个在浏览器中在线创建HTML图像地图的项目。我还使用画布和鼠标单击在图像上绘制线条：项目：http://www.kolchose.org/simon/ajaximagemapcreator/

源代码位于http://code.google.com/p/imagemap/

JavaScript：颜色随机连接线

1 个答案: