SQLデータベースにステンシル(SVG)をインポートできるWindowsアプリケーション(ソースコードなし)があります。そこから、アプリケーションは図面面に挿入します。あなたはお互いの上に複数のステンシル層を持つことができます。透過性がある場合、クリックして下にあるステンシルを選択できるはずです。トランスペアレントなSVGオブジェクトをオーバーレイするSVGオブジェクトにクリックする方法は?
特定の条件に基づいて異なるバージョンのステンシルを頻繁に変更するストアドプロシージャがあります。私は、あるステンシルの高さ/幅から別のステンシルの高さ/幅への歪みに関する問題を抱えていました。
私は両方の問題を解決する方法を見つけなければなりませんでした。おそらく私が思いついたのは正しい方法ではありませんが、私はSVGの専門家ではありません。ステンシル内のsvg
オブジェクトの高さと幅を設定しても何も修正されなかったので、私はrect
を透明に塗りつぶして、その高さと幅をルートと同じ値に設定しましたsvg
オブジェクト。このようにして、ストアドプロシージャがどのように切り替えられても、ステンシルは中央に配置されることが保証されました。
すべてが素晴らしく、私は完了したと思った。しかし、固定幅では、rect
をfill:none;stroke:none;stroke-width:0;
に設定しても、クリック可能な空白スペースを持つ長方形が作成されました。そのステンシルの下にあるものをクリックすることはできません。
「透過」空白スペースをクリックスルーして下にあるステンシルを選択できるようにするには、ステンシルの高さと幅をリサイズで真にできるようにするためには何が必要ですか?
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1"
width="60" viewBox="0 0 60 30" preserveAspectRatio="xMidYMid meet">
<style type="text/css">
<![CDATA[
.st1 {fill:none;stroke:#0000ff;stroke-dasharray:1.2,2.4;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.2}
.st2 {fill:none;stroke:none;stroke-width:0;}
]]>
</style>
<g>
<rect class="st2" height="30" width="60" x="0" y="0" />
</g>
<g>
<path class="st1" d="m 20,15 a 10,10 0 1 1 20,0 10,10 0 1 1 -20,0 z" />
</g>
</svg>
P.S.アプリケーションが新しいバージョンのSVGをうまく扱えないので、の代わりにcircle
を使用しなければならないようです。
遅く応答して申し訳ありません。悲しいかな、これは私たちの問題に全く影響しませんでした。 –