在拉斐爾JS中繪製兩個百分點之間的線

我試圖繪製兩個基於百分比定位的圓之間的路徑。他們這樣定位的原因是我縮放紙張並希望保持其位置。在拉斐爾JS中繪製兩個百分點之間的線

這與圈效果很好，但是當我嘗試繪製如下路徑：

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

我得到的是：

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

我如何得到這個？

另外，有沒有辦法獲得元素的百分比位置，而無需手動計算？

謝謝！

更新：

我結束了我的解決問題，而是在一個漂亮的手工，workaroundy方式：

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));

不用說，這是不是很大。

來源

2012-04-28 Joel

您如何更精確地繪製圓圈？ – mihai 2012-04-29 16:06:49

paper.circle（'50％'，'50％'，20）; – Joel 2012-04-30 16:41:16

在SVG PathData specification中沒有跡象表明這種語法是允許的。事實上，我有點驚訝，它允許像一個圓圈的中心......但我想你是對的。
但是，如果您執行縮放，則位置不會保持固定，您可以在此jsfiddle中看到：http://jsfiddle.net/PUg8r/

來源

2012-04-30 18:21:20 mihai

在拉斐爾JS中繪製兩個百分點之間的線

回答

相關問題