Javascript 计算d3 js中csv数据集中的文本字段数
我正在使用d3.js制作一个简单的条形图。我使用Javascript 计算d3 js中csv数据集中的文本字段数,javascript,d3.js,charts,count,Javascript,D3.js,Charts,Count,我正在使用d3.js制作一个简单的条形图。我使用d3.csv数据制作了条形图。但是,现在我尝试只使用csvfile中的一列 此列中的所有项目都是字符串值,特别是城市。其中一些是独一无二的,但另一些则不止一次出现 例如: city Mor Gdl Mex Bog Mad Rio Bar Mor Gdl Mor Rio Mor Bog Mor 我想使用此列创建条形图x值将是城市,y值将是城市出现的次数 我正在使用这个代码。但是,我无法获取y值: d3.csv("../cities.csv", fu
d3.csv
数据制作了条形图。但是,现在我尝试只使用csvfile中的一列
此列中的所有项目都是字符串值,特别是城市。其中一些是独一无二的,但另一些则不止一次出现
例如:
city
Mor
Gdl
Mex
Bog
Mad
Rio
Bar
Mor
Gdl
Mor
Rio
Mor
Bog
Mor
我想使用此列创建条形图x值
将是城市,y值
将是城市出现的次数
我正在使用这个代码。但是,我无法获取y值
:
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;
});
为了得到这种条形图,我如何改进这一功能
欢迎提出任何改进建议!谢谢。如果我没弄错的话,您可以计算每个城市发生的频率,并将其存储在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];
});
谢谢,@Stuurpiek我试过你的例子,但它没有描绘出每个城市的价值观。我在想d3.histogram()是否可以作为一个解决方案。在我的代码稍作修改后,您的示例非常有效!谢谢一个问题:
undefined
代表什么?@estebanpdl你能分享你修改过的代码吗?