SVGのDOM追加について

投稿日: 投稿者: web_master

SVGはHTMLではなくXMLなので、DOMの追加には一癖あります。
setAttributeNSでxlinkを追加してあげる必要があります。
createElementNSで新規のDOMの追加をします。

var xlinkns = "http://www.w3.org/1999/xlink";
var svgns = "http://www.w3.org/2000/svg";
var circle = document.createElementNS("http://www.w3.org/2000/svg", "circle");
・
・
・
細かいパラメータの追加
・
・
・
circle.setAttributeNS(xlinkns, "href", "#circle");
・
・
・

上記のような感じです。
http://www.hcn.zaq.ne.jp/___/SVG11-2nd/types.html#InterfaceSVGURIReference
http://www.hcn.zaq.ne.jp/___/SVG11-2nd/svgdom.html#RelationshipWithDOM2Events
とりあえず、次のSVGの記事ではもう少しまともな何かを作ってみます。

関連記事

「SVGのDOM追加について」への1件のフィードバック

  1. ピンバック: SVGアニメーション | tomo.mobi

コメントは受け付けていません。