How can I put a json object into a test file ("file.json") and then read that file in a d3.json("file.json", function(error, root))?

Question

I am working on a JavaScript project involving the D3 library and trying to make a bubble chart using this code https://gist.github.com/mbostock/4063269 . In my file, I have made a JSON object that is the JSON object I want to put in to the function

d3.json("testfin.json", function(error, root) {
  if (error) throw error;

  var node = svg.selectAll(".node")
      .data(bubble.nodes(classes(root))
      .filter(function(d) { return !d.children; }))
    .enter().append("g")
      .attr("class", "node")
      .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });

  node.append("title")
      .text(function(d) { return d.className + ": " + format(d.value); });

  node.append("circle")
      .attr("r", function(d) { return d.r; })
      .style("fill", function(d) { return color(d.packageName); });

  node.append("text")
      .attr("dy", ".3em")
      .style("text-anchor", "middle")
      .text(function(d) { return d.className.substring(0, d.r / 3); });
});

I want to somehow put my JSON object where "testfin.json" goes to make the bubble chart. How can I do this in JavaScript?

The JSON object already has the correct formatting for the function.

Can you help me to either create a file with my JSON object and then read from the file or bypass the testfin.json and just make the function take in the JSON object?

These two links answer my question: http://stackoverflow.com/questions/10934853/d3-js-loading-json-without-a-http-get http://stackoverflow.com/questions/13799571/is-d3-json-function-can-get-json-object — rob, Jul 06 '15 at 18:28
No offence, but it took you 10 minutes to find several questions that answer your question -- could you please in the future have a closer look before you post the question? — Lars Kotthoff, Jul 06 '15 at 18:32

score 0 · Answer 1 · answered Jul 06 '15 at 18:23

You need to have the JSON file reachable on your host. If it is at the root of the host then d3.json("testfin.json") should work, alternatively correct path will depend on your folder structure. I suggest you download the gist https://gist.github.com/mbostock/4063269/download and have a look how it works in the example you refer to.

How can I put a json object into a test file ("file.json") and then read that file in a d3.json("file.json", function(error, root))?

1 Answers1