数据样条重叠中的Highcharts问题

时间:2013-09-05 12:20:15

标签: jquery graph highcharts

当我在一圈画出这些点样条并显示一些有线行为时,我遇到了问题。请帮忙解决问题数据是否正确,不应有任何重叠

$(function () {
        $('#container').highcharts({

                                chart: {

                                    renderTo: 'HighCharts',
                                   zoomType: 'x',
                                        height:520
                                },

            credits: {
enabled: false
},


                               title: {
            text: 'Site Tank Fuel Levels',
            x: -20 //center
        },



                                xAxis: {
        type: 'datetime',
          title: {
                text: 'DateTime (Update Recieved)'
            },               
        //ensures that xAxis is treated as datetime values
    },


//tooltip: {
            //headerFormat: '<b>{series.name}</b><br />',
        //  pointFormat: 'Update Recieved Time = {point.x}<br /> Liters = {point.y}'
        //},      


tooltip: {
            formatter: function() {
                    return '<b>'+ this.series.name +'</b><br/>Volume :'
+ this.y +' Liters<br/>Time :'+
                    Highcharts.dateFormat('%H:%M:%S', this.x) +'<br/>'+
Highcharts.dateFormat('%a %d %b', this.x);
            }
        },      


                                yAxis: {


             title: {
                text: 'Disel ( Liters )'
            },
            min: 0,
            max:600


                                },







                                series: [{
        name: 'Tank Volume',
data :[[Date.UTC(2013,8,29,0,4),28.94],[Date.UTC(2013,8,29,4,27),28.53],[Date.UTC(2013,8,29,8,34),27.60],[Date.UTC(2013,8,29,13,4),14.42],[Date.UTC(2013,8,29,19,34),15.24],[Date.UTC(2013,8,30,0,54),14.11],[Date.UTC(2013,8,30,8,2),14.32],[Date.UTC(2013,8,30,15,22),1.44],[Date.UTC(2013,8,30,17,54),3.50],[Date.UTC(2013,8,30,20,39),2.68],[Date.UTC(2013,8,30,23,30),2.99],[Date.UTC(2013,8,31,2,21),3.09],[Date.UTC(2013,8,31,5,11),2.99],[Date.UTC(2013,8,31,8,2),2.99],[Date.UTC(2013,8,31,10,41),51.71],[Date.UTC(2013,8,31,13,10),45.53],[Date.UTC(2013,8,31,15,46),44.50],[Date.UTC(2013,8,31,18,25),45.11],[Date.UTC(2013,8,31,21,16),44.08],[Date.UTC(2013,9,1,0,7),43.47],[Date.UTC(2013,9,1,2,57),43.47],[Date.UTC(2013,9,1,5,48),43.36],[Date.UTC(2013,9,1,8,35),42.54],[Date.UTC(2013,9,1,10,49),37.80],[Date.UTC(2013,9,1,12,41),31.52],[Date.UTC(2013,9,1,14,39),27.91],[Date.UTC(2013,9,1,16,28),25.54],[Date.UTC(2013,9,1,18,38),25.54],[Date.UTC(2013,9,1,20,47),26.78],[Date.UTC(2013,9,1,23,19),22.15],[Date.UTC(2013,9,2,2,10),22.56],[Date.UTC(2013,9,2,5,0),22.56],[Date.UTC(2013,9,2,7,51),22.35],[Date.UTC(2013,9,2,10,11),20.09],[Date.UTC(2013,9,2,12,39),15.66],[Date.UTC(2013,9,2,15,10),165.73],[Date.UTC(2013,9,2,17,31),166.14],[Date.UTC(2013,9,2,20,10),166.65],[Date.UTC(2013,9,2,22,27),164.18],[Date.UTC(2013,9,3,1,18),169.33],[Date.UTC(2013,9,3,4,9),168.51],[Date.UTC(2013,9,3,7,0),168.10],[Date.UTC(2013,9,3,9,6),164.80],[Date.UTC(2013,9,3,11,24),158.31],[Date.UTC(2013,9,3,13,47),155.43],[Date.UTC(2013,9,3,16,28),153.88],[Date.UTC(2013,9,3,18,39),155.74],[Date.UTC(2013,9,3,20,48),153.99],[Date.UTC(2013,9,3,23,30),152.85],[Date.UTC(2013,9,4,1,55),151.41],[Date.UTC(2013,9,4,4,27),150.79],[Date.UTC(2013,9,4,7,18),149.25],[Date.UTC(2013,9,4,10,6),147.29],[Date.UTC(2013,9,4,12,58),142.66],[Date.UTC(2013,9,4,15,49),141.11],[Date.UTC(2013,9,4,18,40),144.92],[Date.UTC(2013,9,4,21,31),130.71],[Date.UTC(2013,9,5,0,22),130.81],[Date.UTC(2013,9,5,3,13),130.40],[Date.UTC(2013,9,5,5,58),127.62],[Date.UTC(2013,9,5,8,47),126.28],[Date.UTC(2013,9,5,11,37),113.40],[Date.UTC(2013,9,5,14,18),114.54],[Date.UTC(2013,9,5,16,51),110.31]] }]
        });
    });


        </script>
    </head>
    <body>

请帮助解决我面临的重叠问题,看看您在此链接中可以看到图片的问题

http://s21.postimg.org/ovlpzpdsn/9_5_2013_5_18_12_PM.png 请告诉我如何避免这个问题

2 个答案:

答案 0 :(得分:1)

你的问题是你的约会。 Date.UTC期望month参数为0-11而不是1-12。所以,你有9/31 [Date.UTC(2013,8,31,5,11),2.99]的数据,这不是一个有效的日期,它将数据放在10/1,这与你在10/1的数据重叠。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/UTC

答案 1 :(得分:0)

看起来x值没有正确排序。

Highcharts要求您的数据按升序x值排序才能正常工作。