I'm adding a series of buttons to a page with d3js to form a control panel. Within each button I'd like to iterate over some child elements to form an unordered list within the button (longer term this will turn into a drop down with styling and other chicanery).
The code example below is clearly wrong. One doesn't simply walk into mordor, nor do they simply drop a for loop in the middle of an append. I just can't flip my brain over to remember how to get this done. drilldownValues
is an array containing all the elements I'd like to add as list items. I feel like I'm an .each
or something away from a eureka moment, but can't make it fit.
In short, the following is wrong, how do I make it right?
.each(function(d,i) {
var drilldownValues = d.drilldown;
d3.select(this)
.append('ul')
for (var k = 0; k < drilldownValues.length; k++)
{
.append('li')
.text(drilldownValues[k]);
}
})