Question

JSON输出:(来自dt.php）

[{
    "name":"Year",
    "data":[2012,2013]
},{
    "name":"A",
    "date":[111,24]
},{
    "name":"B",
    "date":[34,0]
},{
    "name":"C",
    "date":[365,43]
},{
    "name":"D",
    "date":[496,0]
}]

使用Javascript：

    $(document).ready(function() {
        var chart;

        var option = {
            chart: {
            renderTo: 'hcChart',
            type: 'column'
        },
        title: {
            text: 'Testing'
        },
        xAxis: {
            categories: []
        },
        series: []
        };

        $.getJSON("dt.php", function(json) {
            option.xAxis.categories = json[0]['data'];
            option.series[0] = json[1];
            option.series[1] = json[2];
            option.series[2] = json[3];
            option.series[3] = json[4];
            chart = new Highcharts.Chart(option);
        });
    });

图表确实显示了传说，但没有单一值出现..有任何帮助吗？

Answer 1

将date更改为data：

[{"name":"Year","data":[2012,2013]},{"name":"A","data":[111,24]},{"name":"B","data":[34,0]},{"name":"C","data":[365,43]},{"name":"D","data":[496,0]}]

还记得将图表渲染为div id。 option.chart.renderTo = 'myChart';

工作示例：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script src="http://code.highcharts.com/highcharts.js" type="text/javascript"></script>
<script>
    $(document).ready(function () {
        var chart;

        var option = {
            chart: {
                renderTo: 'hcChart',
                type: 'column'
            },
            title: {
                text: 'Testing'
            },
            xAxis: {
                categories: []
            },
            series: []
        };

        $.getJSON("dt.php", function (json) {
            option.xAxis.categories = json[0]['data'];
            console.log(json);
            option.series[0] = json[1];
            option.series[1] = json[2];
            option.series[2] = json[3];
            option.series[3] = json[4];
            option.chart.renderTo = 'myChart';
            chart = new Highcharts.Chart(option);
        });
    });
</script>
<div id="myChart"></div>

值不显示在highcharts中

1 个答案: