javascript - 设置对象组不起作用

Question

我尝试创建一些箭头，所以我需要将一个矩形和两个三角形组合在一起，然后克隆这个东西。这是我尝试这样做的方法：

var paper = Raphael("arrows", 960, 100);
var r = paper.rect(10, 10, 10, 50);
r.attr({fill: 'black'})
var p1 = paper.path("M5,10L15,0L25,10Z")
p1.attr({"stroke-width": 1, fill: "black"});
p2 = p1.clone();
p2.transform("t0,60r180");
st = paper.set();
st.push(r, p1, p2);
ar2 = st.clone();
ar2.transform("t30,0");

问题是这个 p2 转换的三角形没有被复制，或者至少我在克隆箭头中看不到它。发表在 jsfiddle：http: //jsfiddle.net/empirik/rFuVy/1/

Answer 1

变形三角形不包含在克隆 ar2 中。

如果您只需要完成箭头，请将以下几行添加到您的函数中：

var p3 = p2.clone();
p3.transform("t30,60r180");

Answer 2

我解决了您的问题，您可能需要根据需要更改箭头的大小。但最好的方法是绘制一个path并克隆路径，而不是创建 3 个不同的形状并将其推入SET.

这是代码：

$(function(){
    var paper = Raphael(0,0, 960, 100);
    var path = paper.path("M 20 20 L 35 5 50 20 43 20 43 80 50 80 35 95 20 80 27 80 27 20z").attr("fill", "black");

    path2 = path.clone();
    path2.transform("t50, 0");    

});

你也可以在这里查看演示