0

RaphaeljsでcustomAttributesを作成しています。追加の引数をanimateメソッドに渡そうとしています。呼び出しごとにインクリメントするべきではありません。

現在、Element.data（）メソッドを使用していますが、これは本質的にグローバルであり、一度に複数のアニメーションをキューに入れても存続しないため、いくつかの重大な問題が発生する傾向があります（大きさは常に最後にキューに入れられたアニメーションを表します）。

私はどうやらこの角を曲がったところを考えることができません。

これが私が今していることです：

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

</ p>

4

1 に答える 1

2

これもやってみませんcustomAttributesか？

でカスタム属性を作成するだけです

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

そして、それを他のカスタム属性で使用します

this.attr('magnitude');

.customAttributesこれは、代わりにを使用して複数のアニメーションを使用したフィドルです.data

于 2012-08-14T22:44:57.473 に答える