2013-08-30 44 views
1

讓我們開始有問題的代碼:不正確的日期顯示在海軍報提示

<div id="debug"></div><br /> 
<div id="placeholder" class="demo-placeholder"></div> 
<script language="javascript" type="text/javascript" src="/doppelog/static/doppelog/js/jquery.flot.js"></script> 
<script language="javascript" type="text/javascript" src="/doppelog/static/doppelog/js/jquery.flot.time.js"></script> 
<script type="text/javascript"> 

    $(function() 
    { 
     var alc = 
     { 
      label:"ALC", data: 
      [ 
       [1.3765428e+12,2], 

       [1.3775796e+12,88], 

       [1.377666e+12,109], 

       [1.3777524e+12,65], 
      ] 
     }; 

     var options = 
     { 
      //points: {show:true}, 
      bars: {show:true, fill: .65, barWidth:0.85*24*60*60*1000}, //leading co-efficient for bar width, other scalars to get to 1 day resolution 
      xaxis: 
      { 
       mode: "time", 
       timeformat: "%Y-%m-%d", 
       autoscaleMargin: null 
      }, 
      grid: {hoverable:true} 

     }; 

     function showTooltip(x, y, contents) { 
      $("<div id='tooltip'>" + contents + "</div>").css({ 
       position: "absolute", 
       display: "none", 
       top: y + 5, 
       left: x + 5, 
       border: "1px solid #fdd", 
       padding: "2px", 
       "background-color": "#fee", 
       opacity: 0.80 
      }).appendTo("body").fadeIn(200); 
     }; 

     var previousPoint = null; 
     $("#placeholder").bind("plothover", function (event, pos, item) 
     { 

      if (item) 
      { 
       if (previousPoint != item.dataIndex) 
       { 

        previousPoint = item.dataIndex; 

        $("#tooltip").remove(); 
        var x = item.datapoint[0], 
        y = item.datapoint[1], 
        d = new Date(x), 
        td = d.getFullYear() + "-" + d.getMonth() + "-" + d.getDay(); 
        document.getElementById("debug").innerHTML=x; 
        showTooltip(item.pageX, item.pageY, td + ": " + y); 
       } 
      } 
      else 
      { 
       $("#tooltip").remove(); 
       previousPoint = null;    
      } 
     }); 

     $.plot("#placeholder", [alc], options); 
     //document.getElementById("debug").innerHTML=alc[1]; 
    }); 

</script> 

http://jsfiddle.net/XBCvq/

在x軸的日期標籤是正確的。在鼠標懸停時,x的值顯示在div上方。當您將其作爲「新日期(x)」複製到Javascript控制檯時,會生成正確的日期。

當您將鼠標懸停在某個欄上時,會出現一個多於一個月的日期。爲什麼是這樣,我該如何解決它?

回答

3

大部分差異是由於月份(由getMonth返回)從零開始,其餘是因爲您沒有考慮到UTC偏移量。

它更容易重新使用海軍報自己的formatDate功能,像這樣:

var DATE_FORMAT = "%Y-%m-%d"; // Use this in your plot options as well 
... 
showTooltip(item.pageX, item.pageY, $.plot.formatDate(d, DATE_FORMAT) + ":" + y); 
+0

有沒有嵌入區信息(經檢查發現),但當月的問題是點上。另外,事實證明getDay()在一週中的某一天得到一個數字,與getDate()不同。謝謝! –