Question

I’m trying to use SVG from JavaScript (Google Chrome v21.0). I understand how to create elements etc using XML namespace based functions. But … I notice that there are a whole bunch Object SVG*, e.g. SVGDocument. But I can’t find any reference to how you could use them. For example:

doc1 = new SVGDocument()

returns:

TypeError: Illegal constructor

whilst any other constructor with insufficient arguments returns:

TypeError: Not enough arguments

What is going on here?

Answer 1

You would create an SVG document with document.implementation.createDocument

So for SVG it would be

var dom = document.implementation.createDocument('http://www.w3.org/2000/svg', 'svg:svg', null);

or alternatively

var dt = document.implementation.createDocumentType('svg:svg', '-//W3C//DTD SVG 1.1//EN', 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd');
var dom = document.implementation.createDocument('http://www.w3.org/2000/svg', 'svg:svg', dt);

If you wanted/needed to set the document type too.