Raphael的set使用

Raphael的set使用

$(function() {
    initRaphael();
});
function initRaphael(e) {
    var paper = Raphael(0, 0, 500, 500);
    var r1 = paper.rect(25, 25, 50, 50);
    var r2 = paper.circle(125, 50, 25);
    var r3 = paper.text(200, 50, 'H').attr('font-size', '60px');

    var g1 = paper.rect(100, 100, 50, 50);
    var g2 = paper.circle(200, 125, 25);
    var g3 = paper.text(50, 125, 'H').attr('font-size', '60px');

    var b1 = paper.rect(175, 175, 50, 50);
    var b2 = paper.circle(50, 200, 25);
    var b3 = paper.text(125, 200, '?').attr('font-size', '60px');
    // 创建set的第一种方式，set不会创建一个<g>集合；
    var red_group = paper.set();
    red_group.push(r1,r2,r3);
    red_group.attr('fill','red');
    // 创建set的第二种方式
    var green_group = paper.set(g1,g2,g3);
    green_group.attr('fill','green');
    
    var blue_group = paper.set(b1,b2,b3).attr('fill','blue');
    
    b3.attr('fill','gray');
    var text_group = paper.set(r3,g3,b3).attr('font-size',60);
    var all_groups = paper.set(red_group,blue_group,green_group).attr('stroke-width',0);

      // 可以进行统一的移动
      all_groups.attr('transform','T150,0');

    
}