UTC Woes，Flot X軸時間錯誤

所以我已經通讀了大部分的搜索結果，以及在討論組的flot檔案...不知道我能在這裏做什麼，因爲我不認爲我完全讚賞問題...UTC Woes，Flot X軸時間錯誤

我目前在每日和每週快照圖上都顯示unix時間戳數據。顯示日K線圖選項...

  $.ajax({ 
       url: "/whats/encode_daily_graph.php?itemid=<?php echo $_GET['item']?>", 
       method: 'GET', 
       dataType: 'json', 
       success: onOutboundReceived 
      }); 
      function onOutboundReceived(series) { 
       var length = series.length; 
       var finalData = series; 
       var options = { 
        lines: { show: true }, 
        legend: { show : false }, 
        points: { show: true, hoverable:true }, 
        grid: { hoverable: true, clickable: true }, 
        xaxis: { mode : "time", timeformat : "%H:%M" }, 
        yaxis: { minTickSize: "1", tickDecimals : "0" } 
       }; 
       $.plot($(".graph_daily"), finalData, options); 
      }

所以很多線程（以及該文檔）提到，我應該「假裝的數據是UTC」。在我的情況下，因爲我的數據全部記錄爲PST（UTC-8），所以我應該只將8 * 3600 * 1000添加到我傳入圖表的數據中，對吧？由於某種原因，既不減去也不增加這個偏移量，這是我所期望的 - 任何事物都會變成完全不合理的東西。所以我可能誤解了手頭的整個問題。

任何人都可以提供有關此事的任何見解？謝謝你的時間！

編輯：這是什麼AJAX網址提取一個圖。

[{「label」：「24小時概覽」，「data」：[[1343283113000，「111」]，[1343286597000，「111」]，[1343290220000，「111」]，[1343293802000，「111 「]，[1343297377000，」111「]，[1343300843000，」111「]，[1343304504000，」111「]，[1343308105000，」111「]，[1343311724000，」111「]，[1343315331000，」111「] [1343322489000，「111」]，[1343326080000，「111」]，[1343329669000，「111」]，[1343333296000，「111」]，[1343336882000，「111」]，[1343340493000，「111」]，[ 1343344094000，「111」]，[1343347683000，「111」]，[1343351299000，「111」]，[1343355015000，「111」]，[1343358535000，「112」]，[1343362132000，「112」]，[1343365704000，「112」]]「color」：「＃FFAA42」}]

下面是它在圖形上的樣子。注意我有一個工具提示，它使用Javascript的Date來構造一個Date對象，所以我可以輕鬆獲取json數據的小時和分鐘，並且這與軸不匹配。 http://i.imgur.com/Jwsyd.png

如何提示呈現：

  var previousPoint = null; 
      $(".graph_daily").bind("plothover", function (event,pos,item){ 
       if (item) { 
        if (previousPoint != item.dataIndex) { 
         previousPoint = item.dataIndex; 

         $("#graph_info").remove(); 
         var x = item.datapoint[0].toFixed(2), y = item.datapoint[1].toFixed(2); 
         var date = new Date(item.datapoint[0]); 
         var hour = date.getHours(); 
         var min = date.getMinutes(); 
         var msg = hour + ":" + min + ", " + y; 
         if (min < 10) msg = hour + ":" + "0" + min + ", " + y; 
         showToolTip(item.pageX, item.pageY, msg); 
        } 
       } 
       else{ 
        $("#graph_info").remove(); 
        previousPoint = null; 
       } 
      });

來源

2012-07-27 geogaddi

打印出日期提供JSON數據plzzz從Ajax調用 – thecodejack 2012-07-27 05:24:26

添加的數據。 – geogaddi 2012-07-27 05:34:48

你提供的時間是unix時間戳？ – thecodejack 2012-07-27 05:45:17

所有你需要做的是改變你的提示代碼正確添加時區偏移：

 var x = item.datapoint[0], 
      y = item.datapoint[1].toFixed(2); 
     var date = new Date(x + (7 * 60 * 60 * 1000));

之後，你的圖表軸和工具提示排隊正確爲了我。您可能會發現，讓您的圖表適用於其他時區中的人員會稍微複雜 - 您需要將原始JSON數據移至UTC（即，如果它在PDT中記錄，則在發送到瀏覽器之前添加該數據）。然後，當你去創造，而不是通過偏移提示，7 * 60 * 60 * 1000，你會被這個偏移量：

 var userTZ = new Date();//user = the viewers browser 
     userTZ = userTZ.getTimezoneOffset()*60*1000; 
     var dt = new Date(x+userTZ);

這是工作作爲簡單的例子：http://jsfiddle.net/ryleyb/4uuPZ/

來源

2012-07-27 16:01:12 Ryley

對於工具提示，我實際上最終只是做了getUTCHours（），最終得到同樣的結果呢？我認爲。我會嘗試用您的方法來抵消數據並將其呈現在適當的本地時區。謝謝！ – geogaddi 2012-07-27 17:43:38

Flot確實應該有UTC或本地化呈現日期時間IMHO的標誌。將日期作爲UTC存儲在服務器上是唯一合理的表示形式。但我不認爲你會根據我讀過的列表流量來說服這些flot維護者。 :-( – 2012-11-27 01:13:13

我建議你用在你的PHP以下。輸出將在JS給同一以及

$hour=mktime($h+1,$i,$s,$m,$d,$y)*1000;

來源

2012-07-27 06:35:49 thecodejack

海軍報對於x軸有一個timezone: "browser"選項。設置這將導致日期格式化在本地瀏覽器時間。要在地塊懸停使用Date.toLocalTimeString

來源

2015-10-08 14:06:39

這對我來說非常合適 - 謝謝！ – kales33 2016-12-27 17:08:54

UTC Woes，Flot X軸時間錯誤

回答

相關問題