Search code examples
javascriptjsond3.jsbubble-chart

d3 js - loading json without a http get


I am learning d3. There are certain ways of loading the data in d3 js. But all of them seem to make a HTTP GET. In my scenario, I already have the json data in a string. How can I use this string instead of making another http request? I tried to look for documentation for this but found none.

This works:

d3.json("/path/flare.json", function(json) {
    //rendering logic here
}

Now, if I have:

//assume this json comes from a server (on SAME DOMAIN)
var myjson = '{"name": "flare","children": [{"name": "analytics","children": [{"name": "cluster","children": [{"name": "MergeEdge", "size": 10 }]}]}]}'; 

How do I use already computed 'myjson' in d3 & avoid a async call to server? Thanks.


Solution

  • Simply replace d3.json call with

    json = JSON.parse( myjson );
    

    IE:

    var myjson = '{"name": "flare","children": [{"name": "analytics","children": [{"name": "cluster","children": [{"name": "MergeEdge", "size": 10 }]}]}]}';
    
    // d3.json("/path/flare.json", function(json) { #delete this line
    
        json = JSON.parse( myjson ); //add this line
    
        //rendering logic here
    
    //} #delete this line
    

    UPDATE 09/2013

    Original code has changed. So varname json should be root:

    // d3.json("flare.json", function(error, root) { #delete this line
    
        root = JSON.parse( myjson ); //add this line
    
        //rendering logic here
    
    //} #delete this line