從Illustrator/Gephi創建本地SVG <circle>元素

Question

我想添加交互性到我在Gephi中輸出SVG的網絡圖中。我正在使用一個喜歡我的節點的Raphael模板作爲SVG圈輸入。問題是我的Gephi的SVG圈實際上是貝塞爾曲線。例如：

<path fill="#D52A2A" d="M663.395,426.958c0-2.869-2.324-5.194-5.193-5.194s-5.191,2.325-5.191,5.194 
c0,2.867,2.322,5.189,5.191,5.189C661.069,432.148,663.395,429.826,663.395,426.958"/> 

是否有任何方法將這樣的路徑轉換爲帶有x，y和radius的標準SVG圓元素？

Answer 1

你可以分析的路徑，但它更容易，如果你知道哪些路徑是圓形的，首先，那麼你可以做一個快速近似這樣的：

var p = document.querySelector("path"); 
var c = document.createElementNS("http://www.w3.org/2000/svg", "circle"); 
var b = p.getBBox(); 
c.cx.baseVal.value = b.x + b.width/2; 
c.cy.baseVal.value = b.y + b.height/2; 
c.r.baseVal.value = b.width/2; // assuming width and height are the same 
p.parentNode.appendChild(c); 

提示你的路徑是一個圓可能bbox的寬度和高度非常接近，或者gephi輸出的路徑'd'屬性總是對圓圈使用相同的形式（不確定是否是這種情況）。

Gephi是開源的，所以另一種選擇是讓它輸出你想要開始的東西。

更新：here's a jsfiddle顯示此項。