2016-06-21 86 views
0

我试图以m/d/y的格式获取时间戳,以使用flot在我的x轴中显示。我已阅读API docs,但时间戳不会转换。我哪里错了?JQuery Flot时间戳

flot graph

<!-- Flot demo info --> 
    <script> 
      $(document).ready(function() { 
      //random data 
      var d1 = [ 
       [(new Date(2016, 6, 23)).getTime(), 55], 
       [(new Date(2016, 6, 24)).getTime(), 45], 
       [(new Date(2016, 6, 25)).getTime(), 55], 
       [(new Date(2016, 6, 26)).getTime(), 65], 
       [(new Date(2016, 6, 27)).getTime(), 25], 
       [(new Date(2016, 6, 28)).getTime(), 85], 
       [(new Date(2016, 6, 29)).getTime(), 15], 
      ]; 

      //flot options 
      var options = { 
       series: { 
       curvedLines: { 
        apply: true, 
        active: true, 
        monotonicFit: true 
       } 
       }, 
       colors: ["#26B99A"], 
       grid: { 
       borderWidth: { 
        top: 0, 
        right: 0, 
        bottom: 1, 
        left: 1 
       }, 
       borderColor: { 
        bottom: "#7F8790", 
        left: "#7F8790" 
       } 
       } 
      }; 
      var plot = $.plot($("#security_activity"), [{ 
       label: "Security", 
       data: d1, 
       yaxis: {}, 
       xaxis: { 
       mode: "time", 
       timeformat: "%m/%d/%y" 
       }, 
       lines: { 
       fillColor: "rgba(150, 202, 89, 0.12)" 
       }, //#96CA59 rgba(150, 202, 89, 0.42) 
       points: { 
       fillColor: "#fff" 
       } 
      }], options); 
      }); 
     </script> 

回答

0

唉,愚蠢的我......有x轴/ y轴的位置错误的选项。

更新的代码:

<!-- Flot demo info --> 
    <script> 
      $(document).ready(function() { 
      //random data 
      var d1 = [ 
       [(new Date(2016, 6, 23)).getTime(), 55], 
       [(new Date(2016, 6, 24)).getTime(), 45], 
       [(new Date(2016, 6, 25)).getTime(), 55], 
       [(new Date(2016, 6, 26)).getTime(), 65], 
       [(new Date(2016, 6, 27)).getTime(), 25], 
       [(new Date(2016, 6, 28)).getTime(), 85], 
       [(new Date(2016, 6, 29)).getTime(), 15] 
      ]; 

      //flot options 
      var options = { 
       series: { 
       curvedLines: { 
        apply: true, 
        active: true, 
        monotonicFit: true 
       } 
       }, 
       colors: ["#26B99A"], 
       grid: { 
       borderWidth: { 
        top: 0, 
        right: 0, 
        bottom: 1, 
        left: 1 
       }, 
       borderColor: { 
        bottom: "#7F8790", 
        left: "#7F8790" 
       } 
       }, 
       yaxis: {}, 
       xaxis: { 
       mode: "time", 
       timeformat: "%m/%d/%y", 
       minTickSize: [1, "day"] 
       } 
      }; 
      var plot = $.plot($("#security_activity"), [{ 
       label: "Security", 
       data: d1, 
       lines: { 
       fillColor: "rgba(150, 202, 89, 0.12)" 
       }, //#96CA59 rgba(150, 202, 89, 0.42) 
       points: { 
       fillColor: "#fff" 
       } 
      }], options); 
      }); 
     </script>