src/main/webapp/resources/js/custom-flot.js

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

(function ($) {
  "use strict"; // Start of use strict
  //flot charts
  var container = $("#movingLineFlot");
  // Determine how many data points to keep based on the placeholder's initial size;
  // this gives us a nice high-res plot while avoiding more than one point per pixel.
  var maximum = container.outerWidth() / 2 || 300;
  var data = [];
  function getRandomData() {
    if (data.length) {
      data = data.slice(1);
    }
    while (data.length < maximum) {
      var previous = data.length ? data[data.length - 1] : 50;
      var y = previous + Math.random() * 10 - 5;
      data.push(y < 0 ? 0 : y > 100 ? 100 : y);
    }
    // zip the generated y values with the x values
    var res = [];
    for (var i = 0; i < data.length; ++i) {
      res.push([i, data[i]]);
    }
    return res;
  }
  var series = [{
    data: getRandomData(),
    lines: {
      fill: true
    }
  }];

  var plot = null;

  var FlotFunc = function () {
    plot = $.plot(container, series, {
      colors: ["#e6614f"],
      grid: {
        borderWidth: 0,
        minBorderMargin: 20,
        labelMargin: 10,
        backgroundColor: {
          colors: ["#fff", "#fff"]
        },
        margin: {
          top: 8,
          bottom: 20,
          left: 0
        },

        markings: function (axes) {
          var markings = [];
          var xaxis = axes.xaxis;
          for (var x = Math.floor(xaxis.min); x < xaxis.max; x += xaxis.tickSize * 1) {
            markings.push({
              xaxis: {
                from: x,
                to: x + xaxis.tickSize
              },
              color: "#fff"
            });