javascriptを使ってsvgを追加するには？

Question

私はこのコードを使ってsvgをdivタグに挿入しています。

var container = document.getElementById("div_id"); 
var svg = document.createElement("svg"); 
svg.setAttribute("width",container.clientWidth); 
svg.setAttribute("height",container.clientHeight);  
container.appendChild(svg); 

ブラウザの開発者ツールを使用して確認すると、div内にsvgが存在します。しかし、私は開発ツールのsvgにカーソルを合わせると、幅と高さの属性が500と400に設定されていても「svg 0 * 0」が表示されています。私はsvg内に見える行をsvgに挿入しようとしましたが、ブラウザには表示されませんでした。助けが必要。

Answer 1

あなたのSVGを作成するために使用する

var svg = document.createElementNS("http://www.w3.org/2000/svg",'svg'); 

。要素にも同様に使用します。

var circle = document.createElementNS("http://www.w3.org/2000/svg",'circle'); 

通常の要素と同じように機能します。