2012-12-03 4 views
1

내 캔버스에서 KineticJS로 생성 한 모양으로 3D 효과를 만들려고합니다. 맨 위로 드래그하면 크기가 작아 질 필요가 있으며 하단으로 드래그하면 커질 수 있습니다.mousemove에서 반경 변경 kineticJS

내가 원한에 도착 가장 가까운 당신이 여기

$.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); 

}); 

참조하지만, 드래그 다시 모양을 클릭하여 종료 할 때 이것은 단지 반경을 변경하는 MouseMove 이벤트 이벤트와 함께입니다.

드래그 할 때 "실시간"으로 변경할 수 있다면 아주 좋을 것입니다.

누구든지 해결 방법을 알고 있습니까? 여기 내 JSFiddle입니다. http://jsfiddle.net/ZsADd/1/

고마워요!

+0

피들링에 거품이 없습니까? 어쩌면 kinectic 라이브러리를로드해야합니다. – Tschallacka

+0

내 실수. 나는 링크를 업데이트했다. 주의 해 주셔서 감사합니다. – Decor

답변

2

내가 원하는 것은 bubble.on("dragmove")라고 생각합니다. Here is an example of it in action. 드래그 이벤트에 대한 자세한 내용은 here 문서를 참조하십시오.

우리가 dragstart, dragmove, 또는 dragend 이벤트를 감지 할 on() 방법을 사용할 수 있습니다 드래그를 감지하고 KineticJS와 이벤트를 제거합니다. on() 메서드는 이벤트 유형이 발생하고 이벤트가 발생할 때 함수가 실행되어야합니다.

+0

이것은 정확히 내가 찾고있는 것입니다. 이제 나는 문서에서 그걸 보면서 어리 석다. 감사합니다 이반! – Decor