14

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

4

3 回答 3

11

您可以根据 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);
}

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

于 2009-11-07T11:33:46.833 回答
0

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

祝你好运。

于 2009-11-07T04:36:09.427 回答
-3

在 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>
于 2012-10-18T11:36:16.273 回答