Использование ассоциативного массива в качестве данных для D3

У меня есть очень простой пример D3, который сначала считывает данные в ассоциативный массив, а затем отображает их в виде гистограммы.

Однако с помощью этого метода я не могу ничего отобразить. Вместо этого я должен вставить промежуточную задачу: прочитать данные в ассоциативный массив, скопировать эти данные в простой массив, а затем отобразить гистограмму, используя простой массив.

chart.selectAll("div")
     .data(genreAssociative)
     .enter().append("div")
     .style("width", function(d) { return d * 10 + "px"; })
     .text(function(d) { return d; });

Описанное выше не работает.

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; });

Вышеизложенное делает; используя простой массив в качестве посредника. Существует ли особый способ перебора ассоциативного массива вместо стандартного массива?