在KineticJS中拖动形状/组时突出显示可能的放置目标

我正在使用KineticJS来实现图形编辑器。我想拖动一个KineticJS集团并将其放到另一个形状中。到目前为止，这样做很好，已经完成了将“拖放”事件绑定到组中的处理程序。但是我想在拖动过程中在其上悬停时将颜色更改为潜在目标形状，以便证明它是合适的放置形状。我看不到这样做的方式，我无法在Kinetic文档中找到任何帮助。我怎么办？在KineticJS中拖动形状/组时突出显示可能的放置目标

感谢， ECA

来源

2012-07-03 eca

一些喃喃自语后，我想我已经找到了解决办法：

var aShape = new Kinetic.Shape(...); 
    : 
    aShape.on("dragmove", function(evt) { 

    // Detect shapes under mouse position 
    var pos = aShape.getStage().getUserPosition(evt); 
    var collidingShapes = aShape.getStage().getIntersections(pos); 
    : 
    // If needed, filter out colliding shapes not suitable for drop 
    : 
    // Highlight drop target candidates, e.g. simulating a "mouseover" 
    for (var iTarget = 0; iTarget < collidingShapes.length; ++iTarget) 
     collidingShapes[iTarget].simulate("mouseover"); 

    // If you need to remove highlighting, keep track of previously 
    // highlighted shapes and call simulate("mouseout") on those 
    // not currently in the candidates set. 
    });

来源

2012-07-04 14:25:07 eca

只是一个想法，但为了避免这种潜在的使用了很多CPU，如何使用setInterval来检查交集。使用鼠标悬停只是为了用setInterval更新共享变量。这样，您可以确保每次运行该函数时都具有正确的数据，但也可以将其降低到更平滑的刷新率。在dragend上，只需clearInterval。 –

虽然你没有实际的工作是什么，我觉得很慢。我所做的，就是更换kineticjs线3142（V4.0.1）：与

else if (this.targetShape)

else if(this.targetShape && !go.drag.moving)

，它就像一个魅力。现在触发mouseout和mouseover事件。
无论如何，我不知道为什么，但是舞台对象（shaperagging左右）有一个属性指向潜在目标，但它已被删除。

来源

2012-09-05 22:51:24

在KineticJS中拖动形状/组时突出显示可能的放置目标

回答

相关问题