46

JavaScript で SVG 要素ビューボックスを変更しようとしています。基本的には二分探索木を描いているのですが、大きくなりすぎるとビューボックスを変更してズームアウトし、木がウィンドウに収まるようにしたいです。私は現在使用しています:

if(SVGWidth>=1000){
  var a = document.getElementById('svgArea');
  a.setAttribute("viewbox","0 0 " + SVGWidth + " 300");
}

HTML は次のとおりです。

<svg id="svgArea" xmlns="w3.org/2000/svg"; xmlns:xlink="w3.org/1999/xlink"; width="1000" height="300" viewBox="0 0 1000 300">

setAttributeNS('null',...) も使用してみましたが、どちらも機能していないようです。私が気付いた奇妙なことの 1 つは、alert(a) すると [object SVGSVGElement] が表示されることです。これは奇妙に思えます。どんな助けでも大歓迎です。

4

3 に答える 3

90

svgのコンテキストを確認するのは良いことですが、純粋なSVGドキュメントでは次のことがうまくいきました。

shape = document.getElementsByTagName("svg")[0];
shape.setAttribute("viewBox", "-250 -250 500 750"); 

viewBox大文字と小文字が区別されるためかもしれません。

于 2012-04-10T08:05:17.250 に答える
12

コードにエラーがあります: "viewbox" は "viewBox" とは異なります...B は大文字です。コードを次のように変更します。

a.setAttribute("viewBox","0 0 " + SVGWidth + " 300");
于 2014-10-17T18:05:47.250 に答える