2

JavaScript 関数から要素 (つまり、SVGSVGElement) の viewBox を決定したいと考えています。呼び出し:

svgElement.getAttribute("viewBox")

viewBox が要素に明示的に設定されている場合にうまく機能します。しかし、これが常に当てはまるとは限りません。たとえば、関数を次のすべてのタグで機能させたいと考えています。

(400, 100) <svg width=400 height=100></svg>
(400, 100) <svg width="400px" height="100px"></svg>
(400, 100) <svg style="width: 400px; height: 100px"></svg>
(100,  25) <svg viewBox="0 0 100 25" style="width: 400px; height: 100px"></svg>
(100,  25) <svg viewBox="0 0 100 25" width=400 height=100></svg>

(括弧内の値は、それぞれの場合に関数が返す値です)。SVG をサポートするすべてのブラウザで、すべてのズーム レベルでこれを実行できるようにしたいと考えています。

これは、1 回の (失敗した) 試行を含む JSFiddle です: http://jsfiddle.net/w4BTD/1/

4

2 に答える 2

0

ビューボックスは、特定のグラフィックのセットが特定のコンテナ要素に合うように伸びることを指定するためのものです。この属性は、その動作が必要な場合に設定する必要があります。

属性をsvg要素と同じサイズに設定すると、少し冗長になります(これまで変更しない場合)。コードを小さくしますが、不要であるか、間違っている場合もあります。

ビューボックス属性が設定されているかどうかを確認します。設定されていない場合は、同じになるsvgのサイズを要求します。SVG仕様はそれを助けません...

于 2012-10-23T01:48:54.330 に答える