JQuery Flot时间戳

时间:2016-06-21 20:26:37

标签: javascript jquery flot

我正在尝试以m / d / y的格式获取时间戳,以使用flot在我的x轴上显示。我已阅读API docs,但时间戳仍未转换。我哪里出错?

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>

1 个答案:

答案 0 :(得分:0)

呃,愚蠢的我......错误的地方有xaxis / yaxis选项。

更新代码:

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