我在教自己D3。我的目标是创建一个下拉菜单,其中一个人可以选择一个名字,返回的是一张带有该人消费习惯的热图(请告诉我,如果我在这里过于雄心勃勃,我真的不知道)。我创建了一个虚拟TSV(spend.tsv)文件,其格式(名称,月份编号(mnum),年份,花费)。
name mnum year spent
Jane 1 2010 10
Jane 2 2010 20
Jane 3 2010 30.54
Jane 4 2010 67.84
Jane 5 2010 100
Jane 6 2010 110.87
Jane 7 2010 58
Jane 8 2010 70
Jane 9 2010 68.91
Jane 10 2010 123.56
Jane 11 2010 75.82
Jane 12 2010 12.45
Derek 1 2011 5.45
Derek 2 2011 10
Derek 3 2011 15
Derek 4 2011 30
Derek 5 2011 25
Derek 6 2011 11
Derek 7 2011 42
Derek 8 2011 48
Derek 9 2011 31
Derek 10 2011 23.89
Derek 11 2011 45.67
Derek 12 2011 38.89
Frank 1 2012 1
Frank 2 2012 2
Frank 3 2012 3
Frank 4 2012 4
Frank 5 2012 5
Frank 6 2012 6
Frank 7 2012 7
Frank 8 2012 8
Frank 9 2012 9
Frank 10 2012 10
Frank 11 2012 11
Frank 12 2012 12
是否可以从一个数字(1-12)获得缩写月份。我试着做了
d3.tsv("spending.tsv", function(error, data) {
if (error) console.log(error)
data.forEach(function(d) {
d3.time.format("%b").parse(d.mnum);
});
});
但我得到了
Uncaught TypeError: Cannot read property 'length' of undefined
at e (http://d3js.org/d3.v3.min.js:1:15256)
at Function.t.parse (http://d3js.org/d3.v3.min.js:1:14782)
at http://localhost:8080/spending.html:56:26
我该如何解决这个问题?
如何为选择框抓取唯一值?我不想要十二个名字。
非常感谢你的帮助!
答案 0 :(得分:0)
您可以通过在问题中写入的循环轻松获取数组中的唯一人名。类似的东西:
var unique_names_arr = []; //Will contain unique names
d3.tsv("spending.tsv", function(error, data) {
if (error) console.log(error)
data.forEach(function(d) {
if (unique_names_arr.indexOf(data.name) === -1){
//That means the name doesn't exist and we can push it into the array
unique_names_arr.push(data.name);
};
});
});
上面的代码段使用indexOf
方法检查数组中是否存在元素。
现在要从数字中获取缩写的月份名称,您只需将所有缩写的月份名称存储在数组中:
var abbrev_months = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
console.log(abbrev_months[d.mnum - 1]); //inside the loop
基本上,当abbrev_months[d.mnum - 1]
为1时,d.mnum
将获取第1个或第0个索引,因此它返回" Jan" d.mnum
为1,依此类推。