垂直翻转 Raphael SVG 形状

【问题标题】：Vertically flipping a Raphael SVG Shape垂直翻转 Raphael SVG 形状
【发布时间】：2013-11-18 23:12:04
【问题描述】：

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

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

在小提琴中从同一点开始的两条线，它们被分开了。谁能解释为什么会这样？我相信我没有错过任何争论。

【问题讨论】：

标签： javascript svg charts raphael scale

【解决方案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/

【讨论】：