Подсчитать текстовые поля из набора данных csv в d3 js

Question

Я работаю с d3.js, чтобы сделать простую гистограмму. Я сделал диаграммы с использованием данных d3.csv. Однако теперь я пытаюсь использовать только один столбец из csvfile.

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

Пример:

city 
Mor 
Gdl 
Mex 
Bog 
Mad 
Rio 
Bar 
Mor 
Gdl 
Mor 
Rio 
Mor 
Bog 
Mor 

Я хочу создать гистограмму с помощью этого столбца. x value будет городом и y value будет количество раз, когда город появляется.

Я работаю с этим кодом. Тем не менее, я не могу получить y value:

d3.csv("../cities.csv", function(error, dataset) { 
    dataset.forEach(function(d) { 
     d.count = +d.city; 
    }); 
    x.domain(dataset.map(function(d) { return d.city; })); 
    y.domain([0, d3.max(dataset, function(d) { return d.count; })]); 
    svg.append('g') 
     .attr('class', 'x axis') 
     .attr('transform', 'translate(0,' + h + ")") 
     .call(xAxis); 
    svg.append('g') 
     .attr('class', 'y axis') 
     .call(yAxis) 
     .append('text') 
     .attr('transform', 'rotate(-90)') 
     .attr('y', 6) 
     .attr('dy', '.71em') 
     .style('text-anchor', 'end') 
     .text('Número de contratistas'); 
    var bars = svg.selectAll('.bar') 
     .data(dataset) 
     .enter() 
     .append('rect') 
     .attr('class', 'bar') 
     .attr('x', function(d) { return x(d.city); }) 
     .attr('width', x.rangeBand()) 
     .attr('y', function(d) { return y(d.count); }) 
     .attr('height', function(d) { return h - y(dataset.map(d.count));}); 
}); 

Из этого кода, моя первая попытка получить счет от каждого города был:

dataset.forEach(function(d) { 
    d.count = +d.city; 
}); 

Как я могу улучшить эту fucntion для того, чтобы получить этот вид гистограммы?

Любые предложения по его улучшению приветствуются! Благодарю.

Answer 1

Если я понимаю вас правильно, вы бы хотели посчитать, как часто каждый город встречается и хранит его в d.count. Попробуйте это:

// define count object that holds count for each city 
var countObj = {}; 

// count how much each city occurs in list and store in countObj 
dataset.forEach(function(d) { 
    var city = d.value; 
    if(countObj[city] === undefined) { 
     countObj[city] = 0; 
    } else { 
     countObj[city] = countObj[city] + 1; 
    } 
}); 
// now store the count in each data member 
dataset.forEach(function(d) { 
    var city = d.value; 
    d.count = countObj[city]; 
});