2017-07-03 154 views
1

嗨我有數據作爲JSON格式由PHP返回。它會將日期和時間轉換爲UNIX格式並返回數據。我必須繪製與當前日期的最後5分鐘日期,昨天日期和同一日期的最後一週的三個系列。高圖表不顯示日期和時間在xaxis

每件事情都很好,只有時間沒有以正確的格式顯示,需要幫助來填充xaxis和工具提示中的時間。

樣本數據

[{"name":"WDAY","data":[[1499060167,76],[1499060168,75],[1499060169,83],[1499060170,88],[1499060171,80],[1499060172,74],[1499060173,72],[1499060174,88],[1499060175,84],[1499060176,84],[1499060177,75],[1499060178,96],[1499060179,85],[1499060180,77],[1499060181,77],[1499060182,82],[1499060183,69],[1499060184,77],[1499060185,90],[1499060186,63],[1499060187,92],[1499060188,69],[1499060189,86],[1499060190,77],[1499060191,94],[1499060192,82],[1499060193,70],[1499060194,87],[1499060195,88],[1499060196,92],[1499060197,84],[1499060198,77],[1499060199,80],[1499060200,79],[1499060201,77],[1499060202,71],[1499060203,88],[1499060204,88],[1499060205,94],[1499060206,73],[1499060207,81],[1499060208,78],[1499060209,88],[1499060210,69],[1499060211,88],[1499060212,72],[1499060213,90],[1499060214,85],[1499060215,76],[1499060216,64],[1499060217,71],[1499060218,71],[1499060219,84],[1499060220,78],[1499060221,72],[1499060222,68],[1499060223,95],[1499060224,81],[1499060225,73],[1499060226,75],[1499060227,82],[1499060228,74],[1499060229,70],[1499060230,83],[1499060231,87],[1499060232,70],[1499060233,92],[1499060234,85],[1499060235,86],[1499060236,76],[1499060237,62],[1499060238,88],[1499060239,79],[1499060240,69],[1499060241,81],[1499060242,84],[1499060243,73],[1499060244,80],[1499060245,75],[1499060246,69],[1499060247,98],[1499060248,82],[1499060249,87],[1499060250,65],[1499060251,80],[1499060252,81],[1499060253,71],[1499060254,78],[1499060255,63],[1499060256,69],[1499060257,82],[1499060258,94],[1499060259,71],[1499060260,80],[1499060261,67],[1499060262,85],[1499060263,76],[1499060264,81],[1499060265,73],[1499060266,80],[1499060267,75],[1499060268,82],[1499060269,76],[1499060270,74],[1499060271,62],[1499060272,78],[1499060273,82],[1499060274,79],[1499060275,89],[1499060276,99],[1499060277,92],[1499060278,62],[1499060279,84],[1499060280,83],[1499060281,63],[1499060282,63],[1499060283,82],[1499060284,78],[1499060285,78],[1499060286,81],[1499060287,76],[1499060288,70],[1499060289,62],[1499060290,70],[1499060291,78],[1499060292,82],[1499060293,84],[1499060294,86],[1499060295,69],[1499060296,92],[1499060297,85],[1499060298,68],[1499060299,98],[1499060300,81],[1499060301,81],[1499060302,102],[1499060303,66],[1499060304,75],[1499060305,81],[1499060306,82],[1499060307,90],[1499060308,73],[1499060309,73],[1499060310,62],[1499060311,81],[1499060312,65],[1499060313,74],[1499060314,84],[1499060315,77],[1499060316,70],[1499060317,87],[1499060318,87],[1499060319,85],[1499060320,75],[1499060321,99],[1499060322,88],[1499060323,72],[1499060324,79],[1499060325,78],[1499060326,72],[1499060327,70],[1499060328,82],[1499060329,84],[1499060330,79],[1499060331,94],[1499060332,87],[1499060333,79],[1499060334,76],[1499060335,76],[1499060336,90],[1499060337,83],[1499060338,70],[1499060339,70],[1499060340,75],[1499060341,68],[1499060342,89],[1499060343,67],[1499060344,89],[1499060345,75],[1499060346,91],[1499060347,81],[1499060348,78],[1499060349,73],[1499060350,88],[1499060351,73],[1499060352,93],[1499060353,88],[1499060354,69],[1499060355,81],[1499060356,73],[1499060357,74],[1499060358,78],[1499060359,93],[1499060360,74],[1499060361,80],[1499060362,78],[1499060363,62],[1499060364,76],[1499060365,83],[1499060366,77],[1499060367,77],[1499060368,75],[1499060369,81],[1499060370,72],[1499060371,75],[1499060372,80],[1499060373,75],[1499060374,75],[1499060375,66],[1499060376,61],[1499060377,84],[1499060378,69],[1499060379,76],[1499060380,74],[1499060381,85],[1499060382,92],[1499060383,83],[1499060384,82],[1499060385,76],[1499060386,83],[1499060387,90],[1499060388,84],[1499060389,83],[1499060390,77],[1499060391,69],[1499060392,93],[1499060393,72],[1499060394,67],[1499060395,69],[1499060396,81],[1499060397,84],[1499060398,72],[1499060399,76],[1499060400,89],[1499060401,63],[1499060402,86],[1499060403,76],[1499060404,65],[1499060405,71],[1499060406,82],[1499060407,83],[1499060408,76],[1499060409,93],[1499060410,78],[1499060411,88],[1499060412,85],[1499060413,82],[1499060414,62],[1499060415,64],[1499060416,70],[1499060417,79],[1499060418,80],[1499060419,75],[1499060420,69],[1499060421,82],[1499060422,56],[1499060423,92],[1499060424,76],[1499060425,83],[1499060426,74],[1499060427,79],[1499060428,77],[1499060429,71],[1499060430,75],[1499060431,76],[1499060432,83],[1499060433,79],[1499060434,73],[1499060435,84],[1499060436,81],[1499060437,78],[1499060438,66],[1499060439,89],[1499060440,68],[1499060441,83],[1499060442,87],[1499060443,70],[1499060444,75],[1499060445,74],[1499060446,71],[1499060447,91],[1499060448,75],[1499060449,91],[1499060450,81],[1499060451,92],[1499060452,62],[1499060453,77],[1499060454,70],[1499060455,74],[1499060456,74],[1499060457,80],[1499060458,83],[1499060459,78],[1499060460,79],[1499060461,94],[1499060462,72],[1499060463,82],[1499060464,59],[1499060465,88],[1499060466,74]]},{"name":"YDAY","data":[[1499060166,61],[1499060167,59],[1499060168,55],[1499060169,59],[1499060170,55],[1499060171,58],[1499060172,49],[1499060173,50],[1499060174,54],[1499060175,69],[1499060176,56],[1499060177,56],[1499060178,62],[1499060179,65],[1499060180,70],[1499060181,46],[1499060182,53],[1499060183,60],[1499060184,72],[1499060185,71],[1499060186,45],[1499060187,64],[1499060188,64],[1499060189,56],[1499060190,65],[1499060191,48],[1499060192,65],[1499060193,72],[1499060194,63],[1499060195,52],[1499060196,60],[1499060197,57],[1499060198,67],[1499060199,57],[1499060200,65],[1499060201,87],[1499060202,53],[1499060203,58],[1499060204,54],[1499060205,61],[1499060206,58],[1499060207,57],[1499060208,62],[1499060209,59],[1499060210,70],[1499060211,67],[1499060212,57],[1499060213,54],[1499060214,45],[1499060215,55],[1499060216,52],[1499060217,63],[1499060218,61],[1499060219,63],[1499060220,59],[1499060221,49],[1499060222,69],[1499060223,60],[1499060224,65],[1499060225,66],[1499060226,63],[1499060227,55],[1499060228,68],[1499060229,55],[1499060230,62],[1499060231,64],[1499060232,63],[1499060233,54],[1499060234,70],[1499060235,49],[1499060236,54],[1499060237,67],[1499060238,65],[1499060239,59],[1499060240,49],[1499060241,77],[1499060242,77],[1499060243,43],[1499060244,56],[1499060245,56],[1499060246,43],[1499060247,55],[1499060248,59],[1499060249,63],[1499060250,68],[1499060251,49],[1499060252,67],[1499060253,66],[1499060254,58],[1499060255,64],[1499060256,71],[1499060257,49],[1499060258,71],[1499060259,53],[1499060260,67],[1499060261,46],[1499060262,67],[1499060263,49],[1499060264,65],[1499060265,60],[1499060266,62],[1499060267,59],[1499060268,52],[1499060269,65],[1499060270,50],[1499060271,65],[1499060272,52],[1499060273,66],[1499060274,51],[1499060275,61],[1499060276,57],[1499060277,47],[1499060278,51],[1499060279,59],[1499060280,66],[1499060281,62],[1499060282,51],[1499060283,66],[1499060284,63],[1499060285,60],[1499060286,64],[1499060287,65],[1499060288,74],[1499060289,72],[1499060290,65],[1499060291,69],[1499060292,63],[1499060293,57],[1499060294,67],[1499060295,54],[1499060296,65],[1499060297,57],[1499060298,59],[1499060299,59],[1499060300,61],[1499060301,71],[1499060302,57],[1499060303,47],[1499060304,56],[1499060305,72],[1499060306,64],[1499060307,52],[1499060308,56],[1499060309,69],[1499060310,69],[1499060311,62],[1499060312,75],[1499060313,54],[1499060314,70],[1499060315,52],[1499060316,68],[1499060317,72],[1499060318,61],[1499060319,54],[1499060320,61],[1499060321,55],[1499060322,61],[1499060323,64],[1499060324,73],[1499060325,50],[1499060326,70],[1499060327,58],[1499060328,62],[1499060329,64],[1499060330,62],[1499060331,56],[1499060332,62],[1499060333,64],[1499060334,69],[1499060335,63],[1499060336,55],[1499060337,67],[1499060338,59],[1499060339,68],[1499060340,66],[1499060341,65],[1499060342,69],[1499060343,67],[1499060344,65],[1499060345,54],[1499060346,57],[1499060347,59],[1499060348,56],[1499060349,51],[1499060350,72],[1499060351,63],[1499060352,71],[1499060353,48],[1499060354,70],[1499060355,74],[1499060356,74],[1499060357,65],[1499060358,55],[1499060359,83],[1499060360,65],[1499060361,57],[1499060362,60],[1499060363,52],[1499060364,55],[1499060365,61],[1499060366,58],[1499060367,60],[1499060368,59],[1499060369,61],[1499060370,56],[1499060371,80],[1499060372,67],[1499060373,78],[1499060374,60],[1499060375,64],[1499060376,59],[1499060377,66],[1499060378,60],[1499060379,74],[1499060380,54],[1499060381,57],[1499060382,48],[1499060383,69],[1499060384,68],[1499060385,61],[1499060386,70],[1499060387,50],[1499060388,55],[1499060389,45],[1499060390,60],[1499060391,59],[1499060392,54],[1499060393,69],[1499060394,67],[1499060395,58],[1499060396,62],[1499060397,42],[1499060398,65],[1499060399,71],[1499060400,64],[1499060401,48],[1499060402,60],[1499060403,67],[1499060404,51],[1499060405,57],[1499060406,58],[1499060407,67],[1499060408,66],[1499060409,72],[1499060410,61],[1499060411,67],[1499060412,63],[1499060413,62],[1499060414,54],[1499060415,50],[1499060416,47],[1499060417,67],[1499060418,66],[1499060419,64],[1499060420,68],[1499060421,62],[1499060422,55],[1499060423,53],[1499060424,58],[1499060425,54],[1499060426,65],[1499060427,47],[1499060428,58],[1499060429,34],[1499060430,72],[1499060431,51],[1499060432,74],[1499060433,66],[1499060434,45],[1499060435,66],[1499060436,63],[1499060437,63],[1499060438,62],[1499060439,69],[1499060440,56],[1499060441,67],[1499060442,62],[1499060443,78],[1499060444,55],[1499060445,59],[1499060446,48],[1499060447,54],[1499060448,56],[1499060449,70],[1499060450,55],[1499060451,60],[1499060452,68],[1499060453,54],[1499060454,58],[1499060455,60],[1499060456,52],[1499060457,55],[1499060458,56],[1499060459,48],[1499060460,55],[1499060461,58],[1499060462,57],[1499060463,70],[1499060464,72],[1499060465,61]]},{"name":"ToDAY","data":[[1499060165,72],[1499060166,62],[1499060167,75],[1499060168,76],[1499060169,63],[1499060170,87],[1499060171,65],[1499060172,61],[1499060173,58],[1499060174,55],[1499060175,62],[1499060176,76],[1499060177,71],[1499060178,58],[1499060179,69],[1499060180,59],[1499060181,74],[1499060182,81],[1499060183,77],[1499060184,56],[1499060185,78],[1499060186,70],[1499060187,82],[1499060188,73],[1499060189,84],[1499060190,74],[1499060191,79],[1499060192,64],[1499060193,79],[1499060194,69],[1499060195,64],[1499060196,70],[1499060197,72],[1499060198,62],[1499060199,66],[1499060200,63],[1499060201,94],[1499060202,78],[1499060203,66],[1499060204,75],[1499060205,73],[1499060206,77],[1499060207,63],[1499060208,64],[1499060209,77],[1499060210,75],[1499060211,70],[1499060212,77],[1499060213,69],[1499060214,56],[1499060215,65],[1499060216,65],[1499060217,72],[1499060218,84],[1499060219,74],[1499060220,68],[1499060221,76],[1499060222,73],[1499060223,69],[1499060224,62],[1499060225,61],[1499060226,60],[1499060227,51],[1499060228,77],[1499060229,74],[1499060230,64],[1499060231,69],[1499060232,60],[1499060233,63],[1499060234,78],[1499060235,78],[1499060236,69],[1499060237,61],[1499060238,63],[1499060239,65],[1499060240,74],[1499060241,73],[1499060242,70],[1499060243,59],[1499060244,71],[1499060245,67],[1499060246,65],[1499060247,66],[1499060248,74],[1499060249,77],[1499060250,72],[1499060251,64],[1499060252,59],[1499060253,53],[1499060254,79],[1499060255,58],[1499060256,74],[1499060257,84],[1499060258,61],[1499060259,70],[1499060260,60],[1499060261,64],[1499060262,59],[1499060263,78],[1499060264,62],[1499060265,65],[1499060266,64],[1499060267,73],[1499060268,60],[1499060269,55],[1499060270,70],[1499060271,65],[1499060272,67],[1499060273,72],[1499060274,70],[1499060275,72],[1499060276,72],[1499060277,63],[1499060278,75],[1499060279,60],[1499060280,65],[1499060281,71],[1499060282,78],[1499060283,75],[1499060284,63],[1499060285,71],[1499060286,63],[1499060287,60],[1499060288,64],[1499060289,59],[1499060290,65],[1499060291,73],[1499060292,81],[1499060293,74],[1499060294,56],[1499060295,83],[1499060296,60],[1499060297,73],[1499060298,65],[1499060299,85],[1499060300,70],[1499060301,71],[1499060302,81],[1499060303,76],[1499060304,79],[1499060305,79],[1499060306,63],[1499060307,70],[1499060308,84],[1499060309,67],[1499060310,78],[1499060311,63],[1499060312,61],[1499060313,89],[1499060314,62],[1499060315,64],[1499060316,70],[1499060317,63],[1499060318,58],[1499060319,70],[1499060320,67],[1499060321,66],[1499060322,54],[1499060323,66],[1499060324,62],[1499060325,83],[1499060326,74],[1499060327,70],[1499060328,71],[1499060329,60],[1499060330,64],[1499060331,62],[1499060332,69],[1499060333,72],[1499060334,61],[1499060335,69],[1499060336,59],[1499060337,69],[1499060338,71],[1499060339,73],[1499060340,86],[1499060341,77],[1499060342,67],[1499060343,74],[1499060344,73],[1499060345,68],[1499060346,76],[1499060347,83],[1499060348,58],[1499060349,76],[1499060350,93],[1499060351,80],[1499060352,65],[1499060353,73],[1499060354,76],[1499060355,54],[1499060356,75],[1499060357,70],[1499060358,72],[1499060359,62],[1499060360,70],[1499060361,73],[1499060362,70],[1499060363,76],[1499060364,67],[1499060365,58],[1499060366,64],[1499060367,55],[1499060368,67],[1499060369,65],[1499060370,68],[1499060371,72],[1499060372,73],[1499060373,80],[1499060374,73],[1499060375,65],[1499060376,62],[1499060377,72],[1499060378,61],[1499060379,74],[1499060380,67],[1499060381,88],[1499060382,72],[1499060383,78],[1499060384,77],[1499060385,61],[1499060386,60],[1499060387,55],[1499060388,58],[1499060389,66],[1499060390,72],[1499060391,75],[1499060392,68],[1499060393,74],[1499060394,64],[1499060395,64],[1499060396,81],[1499060397,67],[1499060398,54],[1499060399,75],[1499060400,77],[1499060401,52],[1499060402,55],[1499060403,78],[1499060404,71],[1499060405,58],[1499060406,69],[1499060407,69],[1499060408,86],[1499060409,75],[1499060410,59],[1499060411,66],[1499060412,68],[1499060413,67],[1499060414,60],[1499060415,68],[1499060416,63],[1499060417,72],[1499060418,45],[1499060419,68],[1499060420,93],[1499060421,78],[1499060422,53],[1499060423,74],[1499060424,63],[1499060425,83],[1499060426,76],[1499060427,76],[1499060428,61],[1499060429,67],[1499060430,75],[1499060431,69],[1499060432,66],[1499060433,73],[1499060434,51],[1499060435,60],[1499060436,69],[1499060437,63],[1499060438,64],[1499060439,63],[1499060440,65],[1499060441,70],[1499060442,68],[1499060443,55],[1499060444,58],[1499060445,59],[1499060446,77],[1499060447,71],[1499060448,72],[1499060449,69],[1499060450,65],[1499060451,77],[1499060452,74],[1499060453,66],[1499060454,74],[1499060455,74],[1499060456,64],[1499060457,73],[1499060458,60],[1499060459,71],[1499060460,67],[1499060461,66],[1499060462,78],[1499060463,72],[1499060464,71],[1499060465,81]]}] 

和我的代碼是

<!DOCTYPE html> 
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 

<head> 


<script type="text/javascript" src="js/jquery.min.js"></script> 
    <script type="text/javascript" src="js/highcharts.js"></script> 
    <script type="text/javascript" src="js/data.js"></script> 


</head> 



<body> 


<script type="text/javascript"> 

function requesttps() { 
     return $.ajax({ 
     url: 'http://10.19.82.21/tpsdelsetup.php', 
     type: "GET", 
     async: true, 
     dataType: "json" 
     }); 
    } 


var options = { 
    chart: { 
     renderTo: "chart1", 
     type: 'line', 
     borderwidth: 1, 
     zoomType: 'x', 

     events: { 
    load: function() { 
    var series0 = this.series[0]; 
    var series1 = this.series[1]; 
    var series2 = this.series[2]; 
    setInterval(function() { 
     requesttps().done(function(point) { 
     series0.update({ 

      name: point[0].name, 
      data: point[0].data, 

         }); 
     series1.update({ 
      name: point[1].name, 
      data: point[1].data 
         }); 
     series2.update({ 
      type: 'area', 
      name: point[2].name, 
      data: point[2].data 
         }); 
             }); 
          }, 100000); 
        } 
       } 

    }, 
    title: { 
     text: 'DEL SETUP TPS TREND' 
    }, 

    xAxis: { 
     categories: [], 
     type: 'datetime', 

    }, 
    yAxis: { 
     title: { 
      text: '' 
     }, 
     min: 0 
    }, 
    tooltip: { 
     headerFormat: '<b>{series.name}</b><br>', 
     pointFormat: '"DEL": {point.y:f}' 
    }, 

    plotOptions: { 
     spline: { 
      marker: { 
       enabled: true 
      } 
     } 
    }, 

    series: [] 
}; 


$(function() { 
     requesttps().done(function(point) { 
     options.series = point; 
     var chart = new Highcharts.Chart(options); 
     setTimeout(requesttps(), 100000); 
     }); 
    }); 

    </script> 


      <div id="chart1" style="margin: center"></div> 

</body> 

</html> 

The xaxis is not correct and tool tips also

+0

您的時間戳應乘以1000將UNIX轉換爲紀元時間(javascript時間戳)。 –

+0

我剛剛將確切的日期和時間轉換爲unix時間戳。我不明白你的意思,是不是像後期轉換unix時間戳每次都要乘以1000,然後陰謀? –

+0

在JavaScript中,您需要將UNIX時間戳乘以1000,因爲在JS中我們使用的是秒而不是秒。所以1499060167應該是14990601670000等 –

回答

1

最後我RND後得到了答案。時間在不同的時區。從xaxis參數中刪除category [],我在加載圖表時添加了UTC:false。

<!DOCTYPE html> 
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<title>PAN INDIA TPS</title> 
<script type="text/javascript" src="js/jquery.min.js"></script> 
    <script type="text/javascript" src="js/highcharts.js"></script> 
    <script type="text/javascript" src="js/data.js"></script> 


    </head> 



    <body> 


    <script type="text/javascript"> 

    function requesttps() { 
      return $.ajax({ 
      url: 'http://10.19.82.21/tpspanIndia.php', 
      type: "GET", 
      async: true, 
      dataType: "json" 
      }); 
     } 



    var options = { 
     chart: { 
      renderTo: "TPSPAN", 
      type: 'line', 
      borderwidth: 1, 
      zoomType: 'x', 

      events: { 
     load: function() { 
     var series0 = this.series[0]; 
     var series1 = this.series[1]; 
     var series2 = this.series[2]; 
     var series3 = this.series[3]; 
     setInterval(function() { 
      requesttps().done(function(point) { 
      series0.update({ 
       type: 'area', 
      name: point[0].name, 
       data: point[0].data 
          }); 
      series1.update({ 
       type: 'area', 
       name: point[1].name, 
       data: point[1].data 
          }); 
      series2.update({ 
       type: 'area', 
       name: point[2].name, 
       data: point[2].data 
          }); 
      series3.update({ 
        type: 'area', 
       name: point[3].name, 
       data: point[3].data 
          }); 
              }); 
           }, 100000); 
         } 
        } 

     }, 
     title: { 
      text: 'PAN INDIA SETUP WISE TPS TREND' 
     }, 

     xAxis: { 
      tickInterval: 5, 
      type: 'datetime', 

      /*labels: { 
       format: '{value:%H:%M:%S}', 
       rotation: 45, 
       align: 'right' 
      }*/ 

     }, 
     /*yAxis: { 
      title: { 
       text: '' 
      }, 
      //min: 0 
     },*/ 
     tooltip: { 


     formatter: function() { 
         return '<b>' + this.series.name + '</b><br/>' + 
          Highcharts.dateFormat('%H:%M:%S', this.x) + '<br/>' +'Count:'+ 
          Highcharts.numberFormat(this.y, 0); 
        } 

     }, 

     plotOptions: { 
      spline: { 
       marker: { 
        enabled: true 
       } 
      } 
     }, 

     series: [] 
    }; 


    $(function() { 

    Highcharts.setOptions({           
        global : { 
         useUTC : false 
       } 
       }); 
      requesttps().done(function(point) { 
      options.series = point; 
      var chart = new Highcharts.Chart(options); 
      setTimeout(requesttps(), 100000); 
      }); 
     }); 

     </script> 


       <div id="TPSPAN" style="margin: center"></div> 

    </body> 

    </html>