javascript - Raphael JS 选择路径/对象/节点的特定实例

Question

示例如下:http://jsfiddle.net/dhREK/32/

通过 Raphael JS，我使用 for 循环创建一系列三 Angular 形。创建三 Angular 形后，我希望能够通过按索引选择拉斐尔对象来对其中任何一个进行动画处理，例如:

tri[1]

或

tri.1

但我不确定语法是否正确。无论如何，使用

tri.animate({fill: '#ff0000'}, 400)

仅对最后一个三 Angular 形进行动画处理。

如何具体选择其他节点？

谢谢!

var paper = new Raphael(0, 0, 500, 500);

for(var i = 0; i < 6; i++) {
    var coords = 'M 43 0 L 74 63 L 13 63 Z';

    if(i % 2) {
        coords = 'M 43 63 L 74 0 L 13 0 Z';                      
    }

    var tri = paper.path(coords).attr({
       'fill' : '#000',
        'stroke-width' : '0'
    });

    tri.transform('T'+i * 34+',0');
}


tri.animate({fill: '#ff0000'}, 400)

PS:我能够将论文的所有子项作为 jquery 对象获取(如 jsfiddle 链接中所示)，但是在 jquery 对象上使用 animate() 不允许我为拉斐尔属性设置动画...任何对此的评论也将不胜感激!

Answer 1

更适合这种情况的是类似数组的 Paper.set

你可以这样定义

var triangles = Paper.set();

for(var i = 0; i < 6; i++) {
  // ....
  var tri = paper.path(coords) //

  triangles.push(tri);
}

triangles.animate(
  // ...
);