2011-03-31 5 views
0

저는 Raphael에서 초보자입니다. 여기에 문제가 있습니다.Raphael 애니메이션의 신참 질문

가 나는 경로를 정의 : p1, p2 경로의 두 엔드 포인트는

var c = paper.path('M '+p1.x+' '+p1.y+'L '+p2.x+' '+p2.y);

.

경로를 마우스로 클릭하면 p2가 p1로 축소되고 마지막으로 p2가 겹쳐 질 때 p1에 의해 숨김이 생기는 애니메이션 기능이 있습니다. 그렇게하는 방법?

답변

0

내가 아는 한 경로 속성을 애니메이션으로 만들 수 없습니다. 다른 속성으로 경로를 다시 그리는 것이 가장 좋습니다. 따라서 p1의 변수에 "애니메이션을 적용"하고 해당 변수로 경로를 다시 그립니다.

p1 매개 변수를 변경하는 타이머 기능이 필요합니다. 예를 들어 0.1 초마다 p1 매개 변수가 p2 매개 변수에 가깝습니다.

var p1x = 10; 
var p1y = 10; 

var p2x = 20; 
var p2y = 20; 

var t = setTimeout("timer()", 100); 
var p = paper.path(...); 

function timer() 
{ 
    p1x++; 
    p1y++; 

    p.remove(); 
    p = paper.path(with new variables); 

    if(p1x == p2x) clearTimeout(t); 
} 

누군가 다른 사람 그것으로 어려움을 겪고 : http://japhr.blogspot.com/2010/09/cant-animate-raphael-path-positions.html