javascript - d3.js 不读取 Python 生成的 JSON

Question

我使用 Python 从网络上抓取一些数据，然后使用 d3.js 可视化所述数据。我在读取 d3.js 中生成的 JSON 时遇到问题。

Python 代码:

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)

当我在 gVim 中打开这段代码时，我看到:{"nodes": ["{\n\"course_id\":\"类(class) 1\",\n\"prereqs\": null,\n...

我的 d3.js 代码:

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"];
    });
});

我已将其放入 JSONLint它返回:

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

JSONLint 表示 JSON 有效，但我的 d3.js 代码无法读取它。我的 python 生成错误的 JSON 吗？如果是这样，我该如何正确生成它？我在 d3.js 中错误地引用了 JSON 吗？

谢谢

Answer 1

尽管 JSONLint 说代码是“有效的”，但我不认为这是您想要的编码，即 nodes 键下的平面列表。

您过于频繁地 dump-ing JSON 并导致双重序列化。

您可能只需要 course_json_list.append(obj)，而不是 course_json_list.append(json.dumps(obj, indent=4))。在您的情况下，您将字符串保存在 course_json_list 中，该字符串将被转储为字符串。在后一个版本中，您以递归方式存储对象，然后依靠最终的 json.dump 来递归地序列化对象。