Edit Question - KnowledgeHub

Title Body

There are some examples to get data from external json file in d3.js. But these samples do not show the json, so I really want to see how it works. I have this json file test.json, and it looks like [ {"a":"-1.14","b":"4.14"}, {"a":"-0.13","b":"1.38"}, {"a":"-4.19","b":"1.43"}, {"a":"-0.21","b":"3.34"} ] And I want to make a scatterplot with these data. In the d3.js script. I added so far. var width = 400; var height = 400; var x = d3.scale.linear() .domain ([-5, 5]) .range([0, width]); var y = d3.scale.linear() .domain ([-5, 5]) .range([0, height]); var chart = d3.select("body").append("svg") .attr("width", width+70) .attr("height", height+70) .attr("class", chart) .append("g") .attr("transform", "translate(30, 30)"); chart.selectAll("xline") .data(x.ticks(11)) .enter().append("line") .attr("x1", x) .attr("x2", x) .attr("y1", 0) .attr("y2", height) .style("stroke", "#ccc"); chart.selectAll("yline") .data(y.ticks(11)) .enter().append("line") .attr("y1", y) .attr("y2", y) .attr("x1", 0) .attr("x2", width) .style("stroke", "#ccc"); If I use this dataset: var dataset = [ [-1, -3], [2, 4], [3, -4], [-3, 1]]; I added this and it works fine. chart.selectAll("scatter-dots") .data(dataset) .enter().append("circle") .attr("cx", function (d) { return x(d[0]); } ) .attr("cy", function (d) { return y(d[1]); } ) .attr("r", 10) .style("opacity", 0.6); I am wondering how I should change this part that calls data, if I use an external json file. I will really appreciate someone can teach me this! Many thanks.

Tags (comma-separated) Cancel