用Raphael JS在两个百分比点之间绘制一条线

Question

我将尝试在两个以百分比为基础定位的圆圈之间绘制路径。它们被定位的原因是我缩放了画布并希望保持它们的位置。

这对圆圈来说效果很好，但当我尝试像这样绘制路径时：

paper.path("M55% 70%L25% 20%")

我只得到了以下内容：

Error: Problem parsing d="M,0,0"

我该怎么做呢？

另外，有没有一种方法可以自动获取元素的百分比位置，而无需手动计算？

谢谢！

更新：

最终我解决了我的问题，但是采用了相当繁琐的方法：

var canvasX = $('#worldmap svg').width() / 100;
var canvasY = $('#worldmap svg').height() / 100;
mapCanvas.path("M" + Math.floor(parseFloat(from.attr("cx")) * canvasX) + " "
        + Math.floor(parseFloat(from.attr("cy")) * canvasY) + "L"
        + Math.floor(parseFloat(to.attr("cx")) * canvasX) + " "
        + Math.floor(parseFloat(to.attr("cy")) * canvasY));

毋庸置疑，这并不是很好。

- Joel

---

你如何更精确地绘制圆形？ - mihai

paper.circle('50%','50%',20); - Joel

Answer 1

在SVG PathData规范中没有任何迹象表明允许这种语法。实际上，我有点惊讶于像圆的中心这样的东西允许使用它...但我想你是对的。
然而，如果您执行缩放，则位置将不会保持固定，正如您可以在此jsfiddle中看到的那样：http://jsfiddle.net/PUg8r/

- mihai