title: Using an associative array as data for D3
body: <p>I have a very simple D3 example that first reads data into an associative array, then displays it in a bar graph.</p>
  
  <p>I can't seem to get anything to display using this method though. Instead, I have to insert a task in between: Read the data into an associative array, copy that data into a simple array, then display the bar graph using the simple array.</p>
  
  <pre><code>chart.selectAll("div")
       .data(genreAssociative)
       .enter().append("div")
       .style("width", function(d) { return d * 10 + "px"; })
       .text(function(d) { return d; });
  </code></pre>
  
  <p>The above does not work.</p>
  
  <pre><code>genreSimple = [];
  for (var genre in genreAssociative) genreSimple.push(genreAssociative[genre]);         
  chart.selectAll("div")
       .data(genreSimple)
       .enter().append("div")
       .style("width", function(d) { return d * 10 + "px"; })
       .text(function(d) { return d; });
  </code></pre>
  
  <p>The above does; using a simple array as an intermediary. Is there a special way to iterate over an associative array instead of a standard array?</p>