2012-08-13 2 views
0

customAttributes in Raphaeljs을 만듭니다. 애니메이션 메서드에 추가 인수를 전달하려고합니다. 각 호출마다 증가 시켜서는 안됩니다.Raphael customAttributes 메서드에 인수를 전달

현재, 내가 Element.data() 메소드를 사용하고 있지만,이 본질적으로 글로벌과 같은 몇 가지 심각한 문제가 발생하기 쉬운이며, 한 번에 여러 애니메이션을 대기 살아남지 못할 것이다 (크기는 항상 마지막 애니메이션을 대표하는 것 대기 중).

나는이 모퉁이를 돌면 생각하는 것은 분명히 드릴 수 없습니다.

Here is what I'm doing now :

var paper = new Raphael(document.getElementById('paper'), 500, 500); 

// draw a line for reference 
paper.path('M100,100 l300,0').attr({stroke: 'black', 'stroke-width': 1, opacity: .5}); 

/** 
* move a graphic, but with some swagger 
* 
* @param {number} step the raphael increment 
* @param {int} magnitude a fixed number representing the amount of swagger to apply 
*/ 
paper.customAttributes.swagger = function(step) { 
    var mag = this.data('magnitude'); 
    var x = 0; 
    var y = mag*Math.sin(step); 
    return { transform: 't' + x + ',' + y }; 
} 

var rect = paper.rect(100,100, 50,50).attr({ 
    fill: 'red', 
    swagger: [0,0] // initialize swagger so we avoid the nasty NaN issue 
}) 
.data('magnitude', 100); // declare our additional argument, other ways to do this? 

rect.animate({ 
    swagger: [10] 
}, 1000); 

답변

2

왜 당신은 너무 이것에 대한 customAttributes을하지?

그냥

paper.customAttributes.magnitude = function() {}; // that's enough 

와 함께 사용자 지정 특성을 만든 다음 I didn를 .customAttributes 대신

+0

.data로 사용하여 둘 이상의 애니메이션

this.attr('magnitude'); 

Here's a fiddle와 다른 사용자 정의 속성에 사용 customAttributes가 this.attr에 저장되었다는 것을 알지 못합니다. 순수한 광채. – Kato

관련 문제