D3 - 从JSON加载数据不起作用

时间:2013-05-06 02:48:37

标签: javascript python json d3.js

我开始学习D3,它似乎是一个强大的框架。我正在尝试从简单的python webserver加载以下html。我可以看到.json文件已加载,但我没有看到json在chrome浏览器的控制台日志中打印出来。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>D3 Tests</title>
    <script type="text/javascript" src="resources/d3.v3/d3.v3.js"></script>
</head>
<body>
    <script type="text/javascript">
    var dataset;
    console.log("Before json");
    d3.json("pie-chart-data.json",function(error,data){
        if (error) return console.warn(error);
        dataset = data;
        console.log("Dataset is: "+dataset);
    });
    console.log("After json");
   </script>
</body>
</html>

这是JSON文件-pat-chart-data.json

[
{key: "One",y: 5},
{key: "Two",y: 2},
{key: "Three",y: 9},
{key: "Four",y: 7},
{key: "Five",y: 4},
{key: "Six",y: 3},
{key: "Seven",y: .5}
]

我看到“在json之前”和“After json”打印到控制台,但没有看到“Dataset is”日志。我哪里错了 - 请帮忙。

谢谢,K。

1 个答案:

答案 0 :(得分:4)

json文件格式错误,密钥周围必须有双引号,且数字必须以数字或减号(不带点)开头。

[
    {"key": "One",   "y": 5},
    {"key": "Two",   "y": 2},
    {"key": "Three", "y": 9},
    {"key": "Four",  "y": 7},
    {"key": "Five",  "y": 4},
    {"key": "Six",   "y": 3},
    {"key": "Seven", "y": 0.5}
]

完整的json规范和语法可以在json.org

中找到