如何将形状拖放到指定的类画布中

【问题标题】：how to drop a shape into specified class canvas如何将形状拖放到指定的类画布中
【发布时间】：2013-01-15 15:52:00
【问题描述】：

您好，我正在使用 kineticjs，我想知道如何将形状拖放到指定的类画布中。因此，如果我有 5 个具有相同类别的画布，那么我可以将我的形状放入其中。如果它没有掉在其中一个画布上，它就会回到原来的位置！我现在唯一的代码是我创建的形状。

var stage = new Kinetic.Stage({
    container: 'container',
    width: 965,
    height: 200
  });

  var layer = new Kinetic.Layer();    
  var poly = new Kinetic.Rect({
    x: 75,
    y: 75,
    width: 100,
    height: 50,
    fill: '#00D2FF',
    stroke: 'white',
    strokeWidth: 4,
    draggable: true
  });

  // add the shape to the layer
  layer.add(poly);

  // add the layer to the stage
  stage.add(layer);

【问题讨论】：

标签： kineticjs

【解决方案1】：

kineticJS 有一个

 .moveTo();  // (  node.moveTo(container);  )

方法。示例：

 poly.moveTo(stage);

或者如果您有多个画布，例如 stage1、stage2、stage3：

 poly.moveTo(stage1); poly.moveTo(stage2); poly.moveTo(stage3);

您还需要创建一个监听器，它返回一个给定鼠标坐标的容器。这样，当您执行“mousemove”或“touchmove”时，您可以确定您在哪个“容器/阶段”中。如果您在一个有效的容器中，则将形状移动到它。

我个人认为创建一个阶段会更容易，并将其划分为多个部分，并将这些部分层设置为固定大小，这样你就可以这样做：

 var coordinates = stage.getUserPosition();

并使用它来确定将对象放置在哪个层（层是容器的类型）

【讨论】：

如果这对您有帮助，请告诉我