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

时间:2013-01-15 15:52:00

标签: kineticjs

您好我正在使用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);

1 个答案:

答案 0 :(得分: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(); 

并使用它来确定将对象放入哪个图层(图层是容器的类型)