Currently diving into the world of coding with d3.js by working on my very first d3 mini project, following the Free Code Camp curriculum. The goal is to create a basic bar graph using this json file. However, I've hit a roadblock while trying to format the dates within the file. Despite referencing the d3.js API, I'm still struggling. Any advice or guidance would be greatly appreciated! Below is a snippet of my code:
// defining dimensions and margins for the graph
var margin = {top: 20, right: 20, bottom: 30, left: 40},
width = 960 - margin.left - margin.right,
height = 500 - margin.top - margin.bottom;
// creating a function to parse time data
var parseDate = d3.timeFormat("%Y-%m-%d");
// setting up scale ranges
var x = d3.scaleBand().rangeRound([0, width]).padding(0.1);
var y = d3.scaleLinear().range([height, 0],0.5);
// appending the svg element to the page body
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 + ")");
//setting up axis
// fetching 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]);
});