Highcharts列适合/调整图表

时间:2014-05-14 09:29:48

标签: javascript php jquery json highcharts

我写作是因为我回到陷入Highcharts的问题。我有一个月度图表工作正常,除了一件事。缩放级别。 X轴始终显示为0(今天),因此缩放级别不正确。我附上一张图片试图更好地解释它。我需要在图表中设置此列。 我感谢您的帮助!谢谢!

PHP返回的json是(正确的结果):

{"data":[[1401580800000,2],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0],[1400025600000,0]]}

和Javascript文件:

chart = new Highcharts.Chart({
chart: {
    renderTo: 'divStatsGrupo',
    plotBackgroundColor: null,
    plotBorderWidth: null,
    plotShadow: false
    },
    title: {
    text: tituloMes
    },

    tooltip: {
            formatter: function() {
            return Highcharts.dateFormat('%d/%m/%Y',new Date(this.x)) + '<br/>' +'Alarmas: ' + this.y                               
            }   
        },      
    xAxis: {    
    type: 'datetime',
    dateTimeLabelFormats : {
    day: '%e. %b',
    labels: {
        style: {
            width: '200px','min-width': '100px'
                    },
        useHTML : true, 

                }
                }   
            },

yAxis: {
title: {
    text: 'Total alarmas'
    },
    allowDecimals: false,
    min: 0
    },

     series : [{
    showInLegend: false,   
            name : 'Grafica Mensual',
            type : 'column',
            data: data.data,    
    dataLabels: {
                enabled: true,
                rotation: 0,
                color: '#000000',
                align: 'center',
                y: 0,
                style: {
                    fontSize: '14px',
                    fontFamily: 'Verdana, sans-serif',
                }} 
                }]
        });
}); ///cierra get 

编辑:我需要一个月的图形(用户选择),但是,白色区域和Xaxis仅显示所选月份的信息。 PHP文件返回正确的JSON链,但highcharts不适合列。对不起我的英语不好!

enter image description here

1 个答案:

答案 0 :(得分:1)

问题出在你的JSON上,你有相同时间戳的重复值。只需删除它们。

然后!您有未分类的数据,应按时间戳递增排序。

修复后,工作正常,请参阅:http://jsfiddle.net/4nCx3/

var data = {
    "data": [
        [1400025600000, 0],
        [1401580800000, 2]
    ]
};