JSON高圖->空圖表

Question

我有用MySQL編寫的preparejsongrapf.php生成的JSON數據，輸出是以下JSON數據：

[
    {
        "name": "date",
        "data": [
            "Date.UTC(2013,7,30)",
            "Date.UTC(2013,8,5)",
            ...........,
            "Date.UTC(2013,10,29)"
        ]
    },
    {
        "name": "solde",
        "data": [
            17985.76,
            17865.76,
            17820.13,
            ...........,
            2867.88
        ]
    }
]

我認為我的JSON語法很好，highcharts腳本是：

 <script>
        $(document).ready(function() {
            var options = {
                chart: {
                    renderTo: 'graphsolde',
                    marginRight: 130,
                    marginBottom: 25,
                    zoomType: 'x',
                    spacingRight: 20
                },
                title: {
                    text: 'CDN',
                    x: -20 //center
                },
                subtitle: {
                    text: '',
                    x: -20
                },
                xAxis: {
                    type: 'datetime',
                    categories: [{}],
                    maxZoom: 14 * 24 * 3600000, // fourteen days
                    title: {
                        text: null
                    }
                },
                yAxis: {
                    title: {
                        text: 'Solde'
                    },
                    plotLines: [{
                            value: 0,
                            width: 1,
                            color: '#808080'
                        }]
                },
                tooltip: {
                                           }
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'top',
                    x: -10,
                    y: 100,
                    borderWidth: 0
                },
                plotOptions: {
                    area: {
                        fillColor: {
                            linearGradient: {x1: 0, y1: 0, x2: 0, y2: 1},
                            stops: [
                                [0, Highcharts.getOptions().colors[0]],
                                [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
                            ]
                        },
                        lineWidth: 1,
                        marker: {
                            enabled: false
                        },
                        shadow: false,
                        states: {
                            hover: {
                                lineWidth: 1
                            }
                        },
                        threshold: null
                    }
                },
                series: [{}]
            }
            $.getJSON("preparejsongrapf.php", function(json) {
                options.xAxis.categories = json[0]['data'];
                options.series[0] = json[1];
                chart = new Highcharts.Chart(options);
            });
        });
    </script>
</script><div id="graphsolde" style="width:100%; height:600px;"></div>

該圖表出現在屏幕中，但沒有JSON數據。 getjson有什么問題？

Answer 1

將您的JSON與Highchart數據格式進行比較。 請檢查您的JSON格式和Highchart系列格式。 Highchart具有單獨的格式來提供輸入。

Answer 2

做這樣的事情-遍歷數組：

$.getJSON('chart_helpers/acme_charthelper.php?callback=?', function(data) {

                $.each(data, function(key, value) {
                    var series = {data: []};

                    if (key == 'Inbound' || key == 'Outbound') {
                        series.dataGrouping = {enabled: false};

                        series.name = key;

                        if (key == 'Inbound') {
                            series.color = "#85d635";
                        }
                        else {
                            series.color = "#59d5ff";
                        }

                        $.each(value, function(key, val) {

                            series.data.push([key * 1000, val]);

                        });
                        options.series.push(series);
                    }

                    if (key === 'Max') {

                        series.type = 'flags';

                        $.each(value, function(key, val) {
                            series.title = 'Max: ' + val + ' Calls';

                            series.data.push([key * 1000, val]);
                            max = val;
                        });
                        options.series.push(series);
                    }

                });

                var chart = new Highcharts.Chart(options);

Answer 3

這個"Date.UTC(2013,7,30)", ..太錯了。.這只是字符串，如果要傳遞日期，請使用時間戳。 因此，在服務器端，以毫秒為單位生成時間戳，如下所示：

"Date.UTC(2013,7,30)" -> 1377820800000