0

フィドル!!

setViewBox() 関数に渡されるパラメータを表示するために、このフィドルを設定しました。問題は、それが機能している方法は私には意味がありません。

setViewBox(0, 0, 625, 625)よりも大きなボックス/さらにズームインされるのはなぜsetViewBox(0, 0, 1250, 1250)ですか?

また、画像を右に調整するのはなぜsetViewBox(-100, 0, 625, 625);ですか (負の x 値のために左に移動すると予想されます)。

これは、ドキュメントが setViewBox(x, y, w, h) について言っていることです:

パラメーター：

x - 新しい x 位置、デフォルトは 0

y - 新しい y 位置、デフォルトは 0

w - キャンバスの新しい幅

h - キャンバスの新しい高さ

また、ボックスが中央から拡大するのではなく、中央からズームインおよびズームアウトするように、最初の（x）/ 3番目（w）と2番目（y）/ 4番目（h）のパラメータの関係を理解し​​ようとしています。誰か提案があれば、左上隅。

4

2 に答える 2

2

答えは、setViewBox に渡されるパラメーターは基本的に、オブジェクトを見ているウィンドウのサイズを示しているということです。ウィンドウが小さい場合は、オブジェクトが小さく表示されるか、オブジェクトがズームインされます。ウィンドウを左に移動すると、ウィンドウに対してオブジェクトが右に移動します。重要なのは、オブジェクト自体のサイズではなく、見ているウィンドウと考えることです。

于 2013-09-16T15:34:56.083 に答える
0

これは、setViewBox 値を計算する方法を示す例です。jquery を含める必要があります (SVG cocntainer X および Y を取得するため)。

var original_width = 777;
var original_height = 667;
var zoom_width = map_width*100/original_width/100;
var zoom_height = map_height*100/original_height/100;
if(zoom_width<=zoom_height)
   zoom = zoom_width;
else
   zoom = zoom_height;
rsr.setViewBox($("#"+map_name).offset().left, $("#"+map_name).offset().top, (map_width/zoom), (map_height/zoom));
于 2013-05-27T14:28:47.147 に答える