javascript - 带有 JSCharts 的 JSON 数据

Question

JSON数据：

[
    {
        Id: 100,
        Type: "admin",
        Name: "LightSpeedJS Technologies",
        Description: "LightSpeedJS, LLC"
    },
    {
        Id: 200,
        Type: "superadmin",
        Name: "LightSpeedJS Technologies",
        Description: "LightSpeedJS"
    }
]

我是 JSCharts 的初学者。我正在使用 $.getJSON 加载 json 文件，我想用它们创建带有 JSCharts 的图表。

我已经提取了样本，但所有样本都使用 Array 或 XML，但在我的要求中，我必须使用 Json 数据。

以下是我尝试汇总的内容：

<script type="text/javascript">

$(document).ready(function () {

        var myData = new Array();

        $.getJSON("http://.....", function (org_data) {  
            $.each(org_data, function (key, val) {
                myData.push(val.Name);
                myData.push(parseInt(val.Id)); 
            }); 
        });

      var myChart = new JSChart('graph', 'bar');
      myChart.setDataArray(myData);
      myChart.setTitle('Host distribution per macroareas');
      myChart.draw();
 });

</script>

错误：在 Chrome 控制台中，当我检查时出现以下错误：

未捕获的类型错误：无法读取未定义的属性“0”

Answer 1

在从 getJSON 调用收到响应之前，您似乎正在调用图表函数。因此，将您的代码更新为以下

$(document).ready(function () {

    var myData = new Array();

    $.getJSON("http://.....", function (org_data) {  
        $.each(org_data, function (key, val) {
            myData.push(val.Name);
            myData.push(parseInt(val.Id)); 
        }); 
        /* Moved the chart data inside the getJSON call */
        var myChart = new JSChart('graph', 'bar');
        myChart.setDataArray(myData);
        myChart.setTitle('Host distribution per macroareas');
        myChart.draw(); 
    });
});