How to create “svg” object without appending it?

Question

Consider the following code:

var svg = d3.select(\'#somediv\').append(\"svg\").attr(\"width\", w).attr(\"height\", h);

I would like to refa

Answer 1

You can use the following:

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

Note the use of createElementNS. This is required because svg elements are not in the same XHTML namespace as most HTML elements.

This code creates a new svg element, as you would regardless of using D3 or not, and then creates a selection over that single element.

This can be made marginally more succinct but clearer and less error prone as:

var svg = document.createElementNS(d3.ns.prefix.svg, 'svg');