2016-06-21 18 views
0

Ich versuche, Zeitstempel im Format m/d/y in meiner x-Achse mit flot anzuzeigen. Ich habe die API docs gelesen, aber die Zeitstempel konvertieren immer noch nicht. Wo bin ich falsch gelaufen?JQuery Flot Timestamps

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> 

Antwort

0

Ugh, dumm mich ... hatte die xaxis/Optionen in der falschen Stelle yaxis.

Aktualisiert Code:

<!-- 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>