在 mousemove kineticJS 上更改半径

Question

我想用我在画布上用 KineticJS 生成的形状创建某种 3D 效果。 当我将它们拖到顶部时，需要变小，而当我拖到底部时，它们需要变大。

我最接近我想要的东西是你在这里看到的 mousemove 事件

$.each(bubbles, function(){
var bubble = this;
bubble = new Kinetic.Circle({x:this.x, y:this.y, radius:this.r, fill:'#000000', draggable:true});
bubble.on("mousemove",function(){
    bubble.setRadius((bubble.getY()/5));
});
layer.add(bubble);

});

但这只会在结束拖动并再次单击形状时更改半径。

如果我可以在拖动时“实时”更改它们，那就太好了。

有谁知道如何解决这个问题？ 这是我的 JSFiddle http://jsfiddle.net/ZsADd/1/

谢谢！

Answer 1

我认为你想要的是bubble.on("dragmove") 。 这是它在行动中的一个例子。 有关拖动事件的更多信息，请查看我在此处找到的文档。

要使用 KineticJS 检测拖放事件，我们可以使用on()方法来检测dragstart 、 dragmove或dragend事件。 on()方法需要事件类型和事件发生时要执行的函数。