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 に答える