HighCharts不显示图表

时间:2016-03-04 09:35:05

标签: highcharts

我过去生产过很多使用HighCharts功能的脚本但由于某些原因我正在处理当前脚本,我已经失去了这个情节。

我有一个运行MySQL查询的脚本,并产生以下结果:

get_data.php

[{"name":"Room","data":[1267,1268,2371,1254,2374,1364,1378,1385,2372,2242,256,2237,2254,2261,2260,2273,2271,2268,2253,2379,2378,2377,2376,2233,2234,2243,2380,2383,2107,2108,2240,2246,2359,2381,2384,2361,2373,2395,1369,2398,2393,2391,2390,2387,2363,2109,2238,2239,2247,2248,2249,2251,2265,2266,2133,2117,2119,2118,2120,2106,2103,2101,2263,2389,2375,2369,2235,2258,1253,1266,1238,2264,2110,2114,2115,2394,2399]}]

然后我有一个调用Script1的脚本,应该显示一个图表。

图表脚本:

$(function () {

var categories=[];
var data2 =[];


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

    $.getJSON("get_data.php",   function(json) { 
    $.each(json,function(i,el) { 
    if (el.name=="Room") 
    categories = el.data; 
    else data2.push(el); 
    }); 



    $('#container1').highcharts({
        chart: {
            renderTo: 'container',
            type: 'column',
            marginTop: 80,
            marginRight: 30,
            marginBottom: 100, events :{
                    load: function(){
                   this.series[1].hide(); 
                    } 
                }
        },
        title: {
            text: '',
            x: -20, //center
            style: {
            fontFamily: 'Tahoma',
            color: '#000000',
            fontWeight: 'bold',
            fontSize: '11px'
            }
        },
        subtitle: {
            text: '',
            x: -20
        },
        xAxis: {
            categories: categories,
            labels: {
            style: {
                color: '#F00',
                font: '9px Tahoma, Verdana, sans-serif'
            }
            }
        },
        yAxis: {
            max:100,
            showFirstLabel: false,
            lineColor:'#999',
            lineWidth:1,
            tickColor:'#666',
            tickWidth:1,
            tickLength:2,
            tickInterval: 10,
            gridLineColor:'#ddd',
            title: {
                text: 'Percentage',
                style: {
                fontFamily: 'Tahoma',
                color: '#000000',
                fontWeight: 'bold',
                fontSize: '9px'
                }
            },

                stackLabels: { 
                enabled: true,
                y: 10,
                formatter: function() {                      
                    //console.log((this.axis.series[1].yData[this.x] ));
                    return (this.axis.series[1].yData[this.x] ) ;

                },
                style: {
                color: '#000000',
                font: '11px Tahoma, Verdana, sans-serif'
                }
            }
        },

        plotOptions: {

            series: {
                pointWidth: 15,
               stacking: 'normal',
                dataLabels: {
                enabled: true,
                rotation: -90,
                color: '#000000',
                align: 'center',
                format: '{point.y:.1f}', // one decimal
                y: 10, // 10 pixels down from the top
                style: {
                    fontSize: '9px',
                    textShadow: false,
                    fontFamily: 'Verdana, sans-serif'
                    }
                }
            }

        },

        tooltip: {
            formatter: function() {
                    return '<b>'+ this.series.name +'</b><br/>'+
                    this.x +': '+ this.y;
            }
        },
        credits: {
            enabled: false
        },
        legend: {
            enabled: false
        },
        series: data2

    });
});

});

});

任何人都可以看到我出错的地方,我需要找到我丢失的情节:-) 非常感谢您放弃帮助的时间。

此致

1 个答案:

答案 0 :(得分:0)

你是对的,非常感谢。我只需要另一双眼睛,我想我看了很长时间。