Создание SVG элемента и вставка на страницу

[FINoM]

Возвращаюсь к теме работы с SVG. Не понимаю, почему внутри SVG не отображаются элементы, в частности, image, хотя в DOM он есть. Как корректно создать SVG и вставить его на страницу?

SVG = {
	NS: 'http://www.w3.org/2000/svg',
	
	createElement: function(name, attrs){
		var element = document.createElementNS(SVG.NS, name);
		
		if(attrs) {
			SVG.setAttr(element, attrs);
		}
		return element;
	},
	
	setAttr: function(element, attrs) {
		for(var i in attrs) {
			element.setAttributeNS(SVG.NS, i, attrs[i]);
		}
		return element;
	}
}

jQuery(function(){
	var svg = SVG.createElement('svg', {
		xmlns: SVG.NS,
		version: "1.1",
		width: "640",
		height:"480"
	});
	
	var image = SVG.createElement('image', {
		x:"0",
		y:"0",
		width:"320",
		height:"240",
		href:"http://byaki.net/uploads/posts/2008-02/1204270244_1.jpg",
	});
	

	svg.appendChild(image);
	
	document.getElementsByTagName('body')[0].appendChild(svg);

});

_____________________________________________

[FINoM]

Проблема решена. Вот код объекта SVG:

//микро-библиотека для создания SVG элементов и установки атрибутов
	var SVG = {
		
		//нужные пространства имен
		svgns: 'http://www.w3.org/2000/svg',
		xlink: 'http://www.w3.org/1999/xlink',
		
		//создание svg элемента
		createElement: function(name, attrs){
			var element = document.createElementNS(SVG.svgns, name);
			
			if(attrs) {
				SVG.setAttr(element, attrs);
			}
			return element;
		},
		
		//установка атрибутов
		setAttr: function(element, attrs) {
			for(var i in attrs) {
				if(i === 'href') { //путь к изображению приписывается в атрибуте xlink:href
					element.setAttributeNS(SVG.xlink, i, attrs[i]);
				} else { //обычный атрибут
					element.setAttribute(i, attrs[i]);
				}
			}
			return element;
		}
	}

[XPyCTang]

Более корректнее было бы сделать так:

AttrSet = function(element,attr){
   if (attr.href){
      element.setAttributeNS(SVG.xlink,'href',attr.href);
      delete attr.href;
   }
   for (var i in attr){
      element.setAttribute(i,attr[i]);
   }
}

Нет нужды проверять каждый атрибут на соответствие 'href', поскольку у одного элемента не может быть двух одинаковых атрибутов.

[FINoM]

27.06.2011