I'm using d3.js to parse a large XML file whose xml element order -at one particular element depth- turns out to be critical.Until now, I've been traversing & parsing the data using d3.js, using a hierarchy of selections of the form:\[code\] d3.select(this) .selectAll("<elementname>") .each( function(d) { // same again for each child element. }\[/code\]At a given depth in the element hierarchy, this breaks down (the d3 selections group the data by element name, pulling them out of their natural sequence).In an attempt to overcome this I've tried several d3 selection approaches, but none of are providing the originally ordered list in the form the CSS might imply:
selectAll("parent *") // ALL children of parent
selectAll("elementname", "anothername", "yetanothername") // union or logical OR of children
selectAll("*") // ALL children
It seems a mix of d3 and conventional XML DOM traversal approaches (using NodeList or childNodes) is unavoidable. I envisage something along the lines of:\[code\] d3.select(this) .selectAll("<elementname>") // parent to elements at the "troublesome" element depth .each( function(d) { // Pseudocode for conventional XML DOM parsing methods. o get a handle on the firstChild o loop through firstchild's siblings IN ORDER OF OCCURRENCE o for each sibling found, again use d3.selectAll() to process it's children }\[/code\]My problem is to how to get a handle on a node's/element's firstChild from the d3.js "this" object (all attempts so for have return "undefined"). Any ideas?Thanks
