KineticJS - Shape.setPosition();

Question

我在使用KineticJS时遇到了一些麻烦。

从我的fiddle中可以看出，我能够在drop事件中访问Shape对象（box），以获取x，y坐标，并对它们进行数学运算，以获得我想要“捕捉”形状的新坐标，但我无法弄清楚如何设置位置并重新绘制框。

文档最多只提供了一些信息：http://www.kineticjs.com/api-docs.php （请参见Shape.setPosition（x，y））。

这个库有没有人用过？ 编辑： 我现在的工作fiddle: http://jsfiddle.net/Programmer/m4MZk/

- Josh

Answer 1

请查看“海滩上的动物”实验，这是一个根据它们的坐标将形状对象快速固定在位的示例：

http://www.html5canvastutorials.com/labs/html5-canvas-animals-on-the-beach-game-with-kineticjs/

- Eric Rowell

---

谢谢！实际上我昨天已经解决了，并且更新了我的代码片段，但我真的很喜欢你发的文档，我之前没看过它，而且你发的内容本来可以帮助我，所以我会接受你的答案。 - Josh

Answer 2

这对我有效，并已扩展为完整的电路图绘制应用程序。

它基于Animals on the Beach代码，但更简单。

http://reviseomatic.org/help/e-tools/Diagram%20Designer%20Circuits.php

wire1vImg.on('dragend', function() {
  var point = wire1vImg.getPosition();
  var newX = Math.round(point.x / 15) * 15;
  var newY = Math.round(point.y / 15) * 15;
  wire1vImg.setPosition(newX, newY);
  stage.draw();
}); 

- nbauers