2013-09-05 19 views
0

我在繪製這些點樣條曲線並顯示一些有線行爲時遇到了問題。請幫忙解決問題的數據是正確的,不應該有任何overlaping數據樣條重疊中的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 請你告訴我如何避免這個問題

回答

1

你的問題是你的日期。 Date.UTC預計月份參數爲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

+0

非常感謝你,你才發現什麼是爲適當refence – WasimMalik88

+1

因此,所有工作正常錯感謝? –

+0

是的唯一的問題是月份輸入 – WasimMalik88

0

它看起來像你x值排序不正確。

Highcharts要求您的數據按升序排列x值順序才能正常工作。

+0

x值都很好 – WasimMalik88