kineticjs 将组附加到鼠标答案

【问题标题】：kineticjs attach group to mousekineticjs 将组附加到鼠标
【发布时间】：2012-12-01 03:47:58
【问题描述】：

在 kineticJs 中，是否可以在您将组添加到图层后，将该组绑定到用户鼠标指针，以便用户可以将组移动到他们希望放置的位置？然后他们会单击将其放置在该位置。

【问题讨论】：

【解决方案1】：

这就是你可以做到的。当用户想要将组添加到图层时，将执行以下代码：

layer.add(group);
layer.draw();
console.log(stage.getMousePosition());
stage.on('mousemove',
    function (){
        var mouse = stage.getMousePosition();
        group.setX(mouse.x);
        group.setY(mouse.y);
        layer.draw();
    });
stage.on('click',
    function(){
        stage.off('mousemove');
    });

忘记说了。为了让舞台连续获得 mousemove 事件，在某个图层上绘制一个矩形并将其添加到舞台上，即使不透明度为 0，因为它不适用于空白区域。

【讨论】：

您可以直接将其添加到您创建的组对象中，而不是在虚拟舞台对象上添加事件处理程序。

【解决方案2】：

您还可以在创建组时将 group 属性设置为 draggable: true，或者在创建后将其设置为 draggable。

 <script>
  // make draggable on creation
   var group = new Kinetic.Group({
   draggable: true;
  });

  // make draggable after creation
  group.setDraggable(true);
 </script>

这些也可以在组移动后用同样的方法关闭拖动。

http://www.html5canvastutorials.com/kineticjs/html5-canvas-drag-and-drop-a-group-with-kineticjs/

【讨论】：

感谢您发布您的答案！请务必仔细阅读FAQ on Self-Promotion。另请注意，每次链接到自己的网站/产品时，都要求发布免责声明。