將參數傳遞給Raphael customAttributes方法

Question

我正在創建customAttributes in Raphaeljs。我試圖將其他參數傳遞給一個動畫方法 - 每個調用不應該增加的參數。

目前，我使用的是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); 

Answer 1

你爲什麼不採取customAttributes這個嗎？

只是

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

創建自定義屬性，然後在其他自定義屬性與

this.attr('magnitude'); 

Here's a fiddle使用的.customAttributes代替.data