我正在尝试向我在 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 和半径的标准 SVG 圆形元素？
【问题讨论】：
标签： svg raphael adobe-illustrator gephi
您可以分析路径，但如果您知道哪些路径是从圆圈开始的，那么您可以像这样进行快速近似：
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 的宽度和高度非常接近相等，或者路径 'd' 属性 gephi 输出的圆圈始终使用相同的形式（不确定是否是这种情况）。
Gephi 是开源的，因此另一种选择是让其输出您想要开始的内容。
更新： here's a jsfiddle 显示此内容。
【讨论】：