Javascript 画布可拖动，带有kineticJS和剪辑功能_Javascript_Html_Html5 Canvas_Kineticjs

Javascript 画布可拖动，带有kineticJS和剪辑功能

javascript html html5-canvas

Javascript 画布可拖动，带有kineticJS和剪辑功能,javascript,html,html5-canvas,kineticjs,Javascript,Html,Html5 Canvas,Kineticjs,我有一个关于canvas的问题我想使用kinetic来使用移动事件（特别是对于draggable），同时我还想使用clip（）函数这是我的密码： <!DOCTYPE HTML> <html> <head> <style> canvas { border: 1px solid #9C9898; } </style> <script src="kinetic-v3

我有一个关于

canvas

的问题

我想使用

kinetic

来使用移动事件（特别是对于draggable），同时我还想使用

clip（）

函数

这是我的密码：

<!DOCTYPE HTML>
<html>
  <head>
    <style>
      canvas {
        border: 1px solid #9C9898;
      }
    </style>
    <script src="kinetic-v3.9.4.js"></script>
    <script>
      window.onload = function() {
        var stage = new Kinetic.Stage({
          container: "container",
          width: 708,
          height: 500
        });
        var layer = new Kinetic.Layer();

        var circle1 = new Kinetic.Circle({
          x: 150,
          y: 150,
          radius: 75,
          fill: "red",
          draggable: true
        });

        var circle2 = new Kinetic.Circle({
          x: 350,
          y: 150,
          radius: 75,
          fill: "blue",
        });

        layer.add(circle2);
        layer.add(circle1);
        stage.add(layer);
      };

    </script>
  </head>
  <body onmousedown="return false;">
    <div id="container"></div>
  </body>
</html>


帆布{
边框：1px实心#9C9898；
}
window.onload=函数（）{
var阶段=新的动力学阶段({
容器：“容器”，
宽度：708，
身高：500
});
var layer=新的动能层（）；
var circle1=新的动力学圆({
x:150，
y:150，
半径：75，
填充：“红色”，
德拉格布尔：是的
});
var circle2=新的动力学圆({
x:350，
y:150，
半径：75，
填充：“蓝色”，
});
图层。添加（圆圈2）；
图层。添加（圆圈1）；
阶段。添加（层）；
};

我有第一个可拖动的圆，但我想使用它和

剪辑功能，但我真的不知道怎么做。此外，我试图获得如下2d上下文：
var context=this.getContext（）
但它不起作用。如果有人能帮我，谢谢
我也看到了这一点，但它不适用于移动设备。
您提到的在移动设备上不起作用的原因是因为它只使用鼠标事件处理程序：
stage.on("mousemove", function(){})

但您需要添加如下触摸事件：
stage.on("mousemove touchmove", function(){})

touchstart、touchmove、touchend
祝你好运
 您提到的在移动设备上不起作用的原因是它只使用鼠标事件处理程序：
stage.on("mousemove", function(){})

但您需要添加如下触摸事件：
stage.on("mousemove touchmove", function(){})

touchstart、touchmove、touchend
祝你好运