带有json数据的highcharts

Question

我是这些东西的新手。使用来自URL：http://jsfiddle.net/sujay/UMeGS/的代码，我试图用我自己的数据创建一个图表。

使用REST Web服务，我可以从数据库中获取数据，这意味着当我点击以下链接＆＃39; localhos:48095/WebApplication22/webresources/sample22.test15＆＃39; ，我得到如下的json数据

[
    {
        "id": 1,
        "status": "stopped",
        "unit": "a",
        "val": 24
    },
    {
        "id": 2,
        "status": "working",
        "unit": "a",
        "val": 59
    },
    {
        "id": 3,
        "status": "turning",
        "unit": "a",
        "val": 2
    },
    {
        "id": 5,
        "status": "transport",
        "unit": "a",
        "val": 6
    },
    {
        "id": 6,
        "status": "stopped",
        "unit": "b",
        "val": 336
    },
    {
        "id": 7,
        "status": "working",
        "unit": "b",
        "val": 212
    },
    {
        "id": 9,
        "status": "turning",
        "unit": "b",
        "val": 23
    },
    {
        "id": 10,
        "status": "transport",
        "unit": "b",
        "val": 1
    }
]

我稍微修改了http://jsfiddle.net/sujay/UMeGS/的代码，其中我使用了getJSON（）来获取数据。

以下是代码。

$(function () {
    $.getJSON('localhos:48095/WebApplication22/webresources/sample22.test15', function (data) {
        var seriesData = [];
        var xCategories = [];
        var i, cat;
        for (i = 0; i < data.length; i++) {
            cat = 'Unit ' + data[i].unit;
            if (xCategories.indexOf(cat) === -1) {
                xCategories[xCategories.length] = cat;
            }
        }

        for (i = 0; i < data.length; i++) {
            if (seriesData) {
                var currSeries = seriesData.filter(function (seriesObject) {
                    return seriesObject.name == data[i].status;
                });
                if (currSeries.length === 0) {
                    seriesData[seriesData.length] = currSeries = {
                        name: data[i].status,
                        data: []
                    };
                } else {
                    currSeries = currSeries[0];
                }
                var index = currSeries.data.length;
                currSeries.data[index] = data[i].val;
            } else {
                seriesData[0] = {
                    name: data[i].status,
                    data: [data[i].val]
                }
            }
        }

        var chart;
        $(document).ready(function () {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container',
                    type: 'column'
                },
                title: {
                    text: 'Stacked column chart'
                },
                xAxis: {
                    categories: xCategories
                },
                yAxis: {
                    min: 0,
                    title: {
                        text: 'Total fruit consumption'
                    },
                    stackLabels: {
                        enabled: true,
                        style: {
                            fontWeight: 'bold',
                            color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
                        }
                    }
                },
                legend: {
                    align: 'right',
                    x: -100,
                    verticalAlign: 'top',
                    y: 20,
                    floating: true,
                    backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColorSolid) || 'white',
                    borderColor: '#CCC',
                    borderWidth: 1,
                    shadow: false
                },
                tooltip: {
                    formatter: function () {
                        return '<b>' + this.x + '</b><br/>' + this.series.name + ': ' + this.y + '<br/>' +
                            'Total: ' + this.point.stackTotal;
                    }
                },
                plotOptions: {
                    column: {
                        stacking: 'normal'
                    }
                },
                series: seriesData
            });
        });
    });
});

但我无法看到任何东西。图表不显示。请帮帮我。