Getting the raphael id attribute in the DOM

javascript, raphael, svg

Solution

I hadn't seen readysetraphael.com before -- that's pretty nifty.

It should be reasonably straightforward to walk all of the elements inside a given SVG container via the Raphael paper element's forEach method:

var i = 0;
paper.forEach(function (el) 
{
    el.node.setAttribute("id", "node-" + i++ ) );
});

But I should ask -- since you already have your SVGs incorporated into Raphael, why wouldn't you simply use Raphael to style them programmatically? Curiosity about your reasoning prompts me to ask.

Problem

I have converted some SVG to Rapahel using http://readysetraphael.com/ Here is an example of code produced: ``` ... path6233.attr({id: 'path6233' ... ``` I have looked in the attr document and it doesn't mention id as a proper attribute. Neither is the id attribute added to the DOM. Is there some way to make raphael add this ID to the DOM so that I can style the element? Alternatively, can I somehow walk all the paths and add move the id attr to a real DOM ID easily?

Original source