javascript - Raphael 表示するオブジェクトのランダムな順序

Question

を使用しr.set()て、アニメーション化したいすべてのオブジェクトを保持するコレクションを作成しました。

var r = Raphael("holder", '100%', '100%'),
    targets = r.set(),
    size = 30,
    offset = 10;

for (var i = 0, j = 0; j < 10; i += size, j++) {
    targets.push(r.rect(i, 10, size, size));
    i += offset;
}

シンプルなアニメーションを使用して、すべてのオブジェクトをランダムな順序で表示したいと思います。

function animate() {
    targets[index].animate({
        fill: "#cde",
        opacity: 1
    }, 1000, 'linear');
    index++;
    if (index < targets.length) setTimeout(animate, 1000);
}
animate();

上記のコードはすべての要素を表示していますが、順番に 1 つずつ表示しています。

プラグインを使用してランダムソートを試しました：

Raphael.st.sort = function (callback) {
    var cb = callback || function (a, b) {
            if (a.id < b.id) {
                return -1;
            } else if (a.id > b.id) {
                return 1;
            } else {
                return 0;
            }
        };

    Array.prototype.sort(this, cb);
    this.items.sort(cb);
    return this;
};

function shuffle(a, b) {
    return Math.random() > 0.5 ? -1 : 1;
};

しかし運がない。

私の質問は、表示したい要素のコレクションをランダムに並べ替えるにはどうすればよいですか?

これが私のjsfiddleです：http://jsfiddle.net/Misiu/UDmym/