javascript - 垂直翻转 Raphael SVG 形状

Question

我创建了一个fiddle占我项目的一小部分。由于这是在 SVG 中，因此需要垂直反转轴才能形成所需的图表。但是，当我对代码使用转换时，如下所示:

    SVGpaper.path(s).attr({
      stroke: "000",
      "stroke-width": 3,
      transform: "s1,-1"
    });

从 fiddle 的同一点开始的两条线，它们分开了。谁能解释为什么会发生这种情况？我相信我没有错过任何论据。

Answer 1

如果我正确理解了您的需求，我会尝试构建路径字符串，然后添加到循环外部并执行转换...

for (var i = 0; i < dataline.length; i++) {
    var x1 = dataline[i].dataPoints[i].x,
        y1 = dataline[i].dataPoints[i].y;


    s += "M" + x1 + "," + y1;

    for (var j = 0; j < dataline[i].dataPoints.length; j++) {

        var x2 = dataline[i].dataPoints[j].x,
            y2 = dataline[i].dataPoints[j].y;
        s += " L" + x2 + "," + y2;
    }

}

SVGpaper.path(s).attr({
        stroke: "000",
        "stroke-width": 3,
        transform: 's1,-1 T150,0'
    });

在这里更新了 jsfiddle http://jsfiddle.net/Qru24/8/