我正在尝试通过基于Free Code Camp课程的第一个d3 迷你项目来学习如何使用d3.js进行编码.我想用这个json文件制作一个简单的条形图.我试图格式化文件中的日期.我已经尝试过查看d3.js API,但我仍然输了.对于我的任何建议,我将非常感激.这是我的代码
// set the dimensions and margins of the graph var margin = {top: 20, right: 20, bottom: 30, left: 40}, width = 960 - margin.left - margin.right, height = 500 - margin.top - margin.bottom; //then make a function to parse the time var parseDate = d3.timeFormat("%Y-%m-%d"); // set the ranges var x = d3.scaleBand().rangeRound([0, width]).padding(0.1); var y = d3.scaleLinear().range([height, 0],0.5); // append the svg object to the body of the page // append a 'group' element to 'svg' // moves the 'group' element to the top left margin var svg = d3.select("body").append("svg") .attr("width", width + margin.left + margin.right) .attr("height", height + margin.top + margin.bottom) .append("g") .attr("transform", "translate(" + margin.left + "," + margin.top + ")"); //setup axis // get the data d3.json("https://raw.githubusercontent.com/FreeCodeCamp/ProjectReferenceData/master/GDP-data.json").get(function(error,dataset){ var d =dataset.data; d.forEach(function(datum, i) { d[0]=parseDate(datum[0]); //console.log(datum[1]); }); //console.log(d[3][0]); });
Gerardo Furt.. 9
你想要的timeParse
不是timeFormat
:
var parseDate = d3.timeParse("%Y-%m-%d");
使用timeParse,
返回的函数解析指定的字符串,返回相应的日期,如果根据此格式的说明符无法解析字符串,则返回null.
这就是你的forEach
功能应该如何:
data.forEach(function(d) { d[0] = parseDate(d[0]); });
这是一个演示:
var parseDate = d3.timeParse("%Y-%m-%d");
d3.json("https://raw.githubusercontent.com/FreeCodeCamp/ProjectReferenceData/master/GDP-data.json", function(json) {
var data = json.data;
data.forEach(function(d) {
d[0] = parseDate(d[0]);
});
console.log(data);
});
你想要的timeParse
不是timeFormat
:
var parseDate = d3.timeParse("%Y-%m-%d");
使用timeParse,
返回的函数解析指定的字符串,返回相应的日期,如果根据此格式的说明符无法解析字符串,则返回null.
这就是你的forEach
功能应该如何:
data.forEach(function(d) { d[0] = parseDate(d[0]); });
这是一个演示:
var parseDate = d3.timeParse("%Y-%m-%d");
d3.json("https://raw.githubusercontent.com/FreeCodeCamp/ProjectReferenceData/master/GDP-data.json", function(json) {
var data = json.data;
data.forEach(function(d) {
d[0] = parseDate(d[0]);
});
console.log(data);
});