2012-01-06 20 views
0

私はInkscapeで生成されたSVGを有するが、すべてのパスが相対位置(m)をMOVETOた:SVG PATHの絶対位置を知る方法は?

<path xmlns="http://www.w3.org/2000/svg" 
     style="fill: #07fe01; 
       fill-opacity: 1; 
       display: inline; 
       stroke-width: 4px; 
       cursor: auto; 
       stroke: none; 
       opacity: 0.4; 
       filter: none; " 
     d="m 431.36764,202.65372 -20.46139,7.94003 -2.875,8.84375 -3.0625,13.21875 8.8125,0.96875 13.34375,6.84375 9.94451,-6.04527 11.96344,-1.95225 -2.3183,-6.56201 0.1291,-10.53422 z" 
     id="Rossello" 
     inkscape:connector-curvature="0" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" 

     sodipodi:nodetypes="ccccccccccc" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" 
     transform="translate(-0.03124997,-689.42566)" 
     onclick="mapmed.click(this)" 
     onmouseover="mapmed.over(this)" 
     onmouseout="mapmed.out(this)"> 
      <title id="title3042">Rosselló</title> 
    </path> 

私はJavaScriptから各パスの絶対位置を知る必要があるが、私はできません。

答えて

-1

私は絶対的な位置を知る方法を見つけました。間違いは、InkScapeのようなベースレイヤーの翻訳とカウントのカウントを適用せずに、絶対座標を見つけることでした。SVGのように、上から下の順ではありません。

は、ピクセル単位でPATHの最初のノードの絶対位置を知るために、このsteepsに従ってください:

第一SVGオブジェクトの幅と高さを取得します。 svgWidth、svgHeight。

2番目は、基本レイアウトの変換変換を取得します。 baseTransX、baseTransY。

3番目のパスの最初のノードを取得します。 pathX、pathY。

4番目に変換がある場合は変換が存在する場合は0です。pathTransX、pathTransY。 (baseTransY + pathTransY + pathY)

-

X = baseTransX + pathTransX + pathX

Y = svgHeight:この値を用いて

、我々は、Inkscapeの内の最初のノードの絶対XとYを発見することができ

1

私のように見えるnormalizedPathSegListはあなたが望むものです。

+0

おかげでロバートが、常にすべてのメソッドとプロパティnormalizedPathSegListをしようとすると、ヌル – corretge

+0

あるとChromeはありませんgetNormalizedPathSegList()キャッチされない例外TypeError:オブジェクト[オブジェクトSVGPathElement]は何のメソッド「getNormalizedPathSegList」 – corretge

+0

@corretgeありません:それはないだからですyourpath.getNormalizedPathSegList ()、それはyourpath.normalizedPathSegListです。 –

1

はこのような何かを試してみてください:

 ele=$('#Rosello')[0] 
     var bbox = ele.getBBox() 
     var top = bbox.y + bbox.y2 

同じことが、x方向に動作するはずです。

わかりませんが、getBBoxがかなり遅いことがわかります。だから気をつけてください。