CODEWITHSUNDEEP
javascriptpythonjsond3.js
user2740614
user2740614

Reputation: 283

d3.js not reading Python-generated JSON

I'm using Python to scrape some data from the web before visualizing said data using d3.js. I'm having an issue reading the generated JSON in d3.js.

Python code:

course_json_list = []
obj = {u"course_id": course_id, u"prereqs": prereqs}
        course_json_list.append(json.dumps(obj, indent=4))


# setting up JSON output file
json_output = {"nodes": course_json_list,
               "links": None}

with open("course-data.json", "w") as outfile:
    json.dump(json_output, fp=outfile)

When I open this code in gVim, I see: {"nodes": ["{\n \"course_id\": \"Course 1\",\n \"prereqs\": null,\n...

My d3.js code:

var dataset;
d3.json('course-data.json', function(error, json_data) {
    if (error) console.log(error);
    dataset = json_data;
    d3.select("body").selectAll("p")
            .data(dataset.nodes)
            .enter()
            .append("p")
            .text(function(d) {
            //When this is return d; it works
                return d["course_id"];
    });
});

I've put it into JSONLint and it returns: 

{
    "nodes": [
        "{\n    \"course_id\": \"Course 1\", \n    \"prereqs\": null, \n    \"off_w\": null, \n    \"name\": \"Intro\"\n}",
        "{\n    \"course_id\": \"Course 2\", \n ...

JSONLint says the JSON is valid, but my d3.js code won't read it. Is my python generating bad JSON? If so, how do I generate it correctly? Am I referencing the JSON incorrectly in d3.js?

Thanks

Upvotes: 1

Views: 213

Answers (1)

musically_ut
musically_ut

Reputation: 34288

Even though JSONLint says that the code is "valid", I don't think that is the encoding you were aiming for, i.e. a flat list under the nodes key.

You are dump-ing JSON too often and causing double serialization.

Instead of course_json_list.append(json.dumps(obj, indent=4)), you probably only need course_json_list.append(obj). In your case, you are saving strings in course_json_list which is getting dumped as a string. In the latter version, you are storing the objects recursively and then relying on the final json.dump to take care of serializing the object recursively.

Upvotes: 1

Related Questions