2

なぜこれが必要なのか疑問に思っている場合、またはより大きな問題を解決するためのより良い方法を提案したい場合は、より多くのコンテキストを自由に尋ねてください。(これには、キャンパスマップ上に一連の建物の間取り図を配置し、それらの建物マップにある特定のものの絶対位置を見つけることが含まれます。詳細については、質問をぶち壊していました。)

短いバージョンでは、<image xlink:href = "something.svg" />参照を持つSVGファイルを取得し、それを1つの大きなファイルにマージして、参照される各SVGに<svg>およびインラインSVGXMLを埋め込みます。コンテンツ。

したがって、私のトップレベルのソースファイル(Inkscapeで作成)は次のようになります。

<image xlink:href="floorplans/bldg1.svg"
width="165.52684" height="107.10559" y="-1937.7657"
x="2507.1565" transform="matrix(0,1,-1,0,0,0)" />

そして、すべてのベクターデータをインライン化するためのマージされたバージョンでの私の試み:

<svg x="2507.1565" y="-1937.7657" width="165.52684" height="107.10559"
transform="matrix(0,1,-1,0,0,0)" viewBox="0 0 1224 792">
<g id="surface0">
<path style="fill:none;stroke-width:0.72;stroke-linecap:round;stroke-linejoin:round;stroke:rgb(0%,0%,0%);...

したがって、基本的には、スクリプトを使用して<image>を<svg>に置き換え、「floorplans/bldg1.svg」のルート<svg>の内容を貼り付けています。(属性を<image>から<svg>にコピーし、viewBox属性を元の<svg>から新しい属性にコピーします。)

この手法は回転されていないものに対しては機能しましたが、Chromeはこの特定の要素がビューポートの上部から外れていると言っているようです。私はSVGを初めて使用しますが、変換の順序は<svg>でも<image>と同じではないと思います。私が見つけていないばかげた間違いをしましたか、それとも<image xlink:href = "something.svg" transform = ... />をインラインXMLで<svg>に変換することにもっと関与していますか?

ありがとう。

4

1 に答える 1

2

SVG 仕様によると、transform 属性は <svg> 要素には適用されません。<svg> の外側または内側の <g> 要素の <image> 要素にあった変換を代わりに配置できます。

変換がこのように動作する理由は、<svg> 要素が座標系を設定し、変換がそれに依存するためです (それが適用された場合に発生する疑問は、「変換を座標空間で解釈する必要があるかどうか」です)。 SVG 座標系がセットアップされた後ですか?")

于 2011-05-08T08:08:59.367 に答える