Path 将标签放在“"；中心“；SVG路径的定义

我试图在svg文件的多边形上绘制标签。我面临的问题是找到这个多边形的大致中心来放置标签，因为路径的坐标是svg格式的，需要解析。有没有更简单的方法来确定svg多边形的中心（也许有人可以指出javascript库或代码片段）？我使用Raphael javascript库来操作svg，但它似乎没有超出标准svg功能。

您可以尝试做的最简单的事情是通过取多边形中所有点的平均值来计算中心。除了最不规则的多边形外，它应该适用于所有多边形。我在程序中使用了相同的算法，效果很好

---

祝你好运

基于SVG DOM方法，您可以尝试以下类似于多边形建议的近似方法：

var totalPathLength = pathelm.getTotalLength();
var step = totalPathLength / 100;
for(var dist=0; dist < totalPathLength; dist+=step)
{
  var pt = pathelm.getPointAtLength(dist);
  addToAverage(pt.x, pt.y);
}

var totalPathLength=pathelm.getTotalLength（）；
var步长=总路径长度/100；
对于（var dist=0；dist

---

我认为最简单的方法是使用path元素边界框的中心（pathelm.getBBox（）），这比多边形建议更简单。

在svg中插入一个文本标记，并通过计算宽度和高度来定位它

 <svg width="447pt" height="559pt" viewBox="0 0 894 1118" version="1.1" xmlns="http://www.w3.org/2000/svg">
    ............
    ............

   <text x="450" y="300" font-family="Verdana" font-size="15" fill="red" >
        Text To Show
   </text>
</svg>

............
............
要显示的文本

对不起，我的问题措辞不清楚。问题更多的是如何从路径的d属性中获取坐标，该属性采用这种格式，以便计算中心或找到一个javascript库，无需根据svg规范解析属性即可完成此操作。首先要解决的第一个问题是首先将svg转换为多边形。我一直在搜索将svg路径转换为多边形的代码，但没有找到。可能需要深入研究svg项目的源代码：

var bbox=p.getBBox（）；var x=数学地板（bbox.x+bbox.width/2.0）；变量y=数学地板（bbox.y+bbox.height/2.0）帮我搞定了，谢谢@Iwe！这比我想象的要简单得多：）@Iwe的评论应该是一个单独的答案。这是一种更简单、不同的方法，有不同的优缺点。这是一个显示一些关键点和区别的例子：两种方法都不能保证中心位于形状内部，Erik的方法将中心拉向路径中更破碎/复杂/相对周长更高的部分。@user568458阅读我答案的最后一句话，我确实建议使用getBBox方法，虽然我确实遗漏了如何计算bbox矩形的中心，因为我认为它太微不足道了。的确，没有一种方法可以保证计算出的中心位于形状内部。