Question

我正在尝试使用KineticJS在图像上绘制不同的形状，并使用不同的按钮放大和缩小，每个元素都可以通过itsetlf很好地工作，但是当我在同一页面上组合所有函数时，无效。以下是绘制线条的脚本：

 if (drawnewline) {
            document.getElementById('dLine').onclick = function() {
                    layer.on("mousedown", function () {
                        if (moving) {
                            moving = false;
                            layer.draw();
                        } else {
                            var mousePos = stage.getMousePosition();
                            x1 = mousePos.x;
                            y1 = mousePos.y;
                            line = new Kinetic.Line({
                                points: [0, 0, 50, 50],
                                stroke: "red"
                            });
                            layer.add(line);
                            line.getPoints()[0].x = mousePos.x;
                            line.getPoints()[0].y = mousePos.y;
                            line.getPoints()[1].x = mousePos.x;
                            line.getPoints()[1].y = mousePos.y;
                            moving = true;
                            layer.drawScene();
                        }
                    });

                    layer.on("mousemove", function () {
                        if (moving) {
                            var mousePos = stage.getMousePosition();
                            var x = mousePos.x;
                            var y = mousePos.y;
                            line.getPoints()[1].x = mousePos.x;
                            line.getPoints()[1].y = mousePos.y;
                            moving = true;
                            layer.drawScene();
                        }
                    });

                    layer.on("mouseup", function () {
                        moving = false;
                        var mousePos = stage.getMousePosition();
                        x2 = mousePos.x;
                        y2 = mousePos.y;
                        $("#distance").val(calculateDistance(x1, y1, x2, y2));

                    });
                };
            };

可以在http://jsfiddle.net/MEQxq/查看完整的脚本。我将非常感谢您的建议，并提前感谢。

Answer 1

我通过在getElementById中移动“if（drawnewline）”解决了这个问题！同时删除鼠标操作，例如layer.off（'mousemove'）;。

Kinetic JS绘图形状和放大和缩小

1 个答案: