Highcharts:数据已加载,DOM已更新但未显示

时间:2015-12-02 14:13:11

标签: javascript jquery highcharts

我试图创建一个图表但是我的html页面没有显示,而DOM元素似乎装载得很好。

以下是创建图表的My JS功能代码:

this.updateUsageChart = function updateUsageChart() {

                    var jsonData = {
                        categories : ['01/12/2015', '02/12/2015', '03/12/2015', '04/12/2015', '05/12/2015', '06/12/2015', '07/12/2015', '08/12/2015', '09/12/2015', '10/12/2015'],
                        series : [
                            {
                                name: 'MAX',
                                data: [170, 170, 170, 170, 170, 170, 170, 170, 170, 170]
                            }, {
                                name: 'MIN',
                                data: [20, 20, 20, 20, 20, 20, 20, 20, 20, 20]
                            }, {
                                name: 'test1',
                                data: [30, 40, 35, 40, 35, 200, 112, 210, 140, 190]
                            }, {
                                name: 'test2',
                                data: [30, 40, 35, 40, 35, 170, 112, 170, 140, 170]
                            }
                        ]
                    }


                var categories = jsonData.categories ; // Array of String
                var series = jsonData.series;

                $('#usageChart').highcharts({
                    title: {
                        text: 'Test',
                        x: -20 //center
                    },
                    xAxis: {
                        categories: categories
                    },
                    yAxis: {
                        title: {
                            text: 'Test'
                        },
                        plotLines: [{


             value: 0,
                        width: 1,
                        color: '#808080'
                    }]
                },
                tooltip: {
                    valueSuffix: '°C'
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'middle',
                    borderWidth: 0
                },
                series: series
            });

        }

我在我的index.html文件中包含了库:

<script src="../../lib/jquery/jquery.js"></script>
<script src="../../lib/highcharts/highcharts.js"></script>
<script src="../../lib/highcharts/exporting.js"></script>

0 个答案:

没有答案