2013年6月18日火曜日

【SVG】image要素をjavascriptで動的に作成する

imageタグを使用することで、SVGに画像を挿入することができる。
javascriptでimage要素を生成する際つまづいた。

【結論】 こうすればできた。

var svgimg = document.createElementNS('http://www.w3.org/2000/svg','image');
svgimg.setAttribute('height','100');
svgimg.setAttribute('width','100');
svgimg.setAttribute('id','testimg1');
svgimg.setAttributeNS('http://www.w3.org/1999/xlink','href','sample.png');
svgimg.setAttribute('x','0');
svgimg.setAttribute('y','0');


xlink:hrefは名前空間がxlinkなので、setAttributeNSで属性設定をする。
ほかの属性はsetAttributeで指定するとできた。

0 件のコメント:

コメントを投稿