JSON 数据与 JSCharts

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 的图表。

我已经提取了样本，但所有样本都使用数组或 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 控制台中，当我检查时出现以下错误：

Uncaught TypeError: Cannot read property '0' of undefined

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(); 
    });
});

JSON 数据与 JSCharts

JSON data with JSCharts

javascript

jquery

json

jscharts