dianping/cat · error · Error

Time mode requires the flot.time plugin.

Error message

Time mode requires the flot.time plugin.

What it means

Since flot 0.8, time-mode axes were split into the flot.time plugin which installs a tickGenerator for mode:'time'. The core setup detects opts.mode == 'time' with no axis.tickGenerator installed — meaning the plugin never ran — and throws a friendly reminder rather than producing garbage ticks.

Source

Thrown at cat-home/src/main/webapp/assets/js/uncompressed/flot/jquery.flot.js:1736

            } else {
                size = 10;
            }

            size *= magn;

            if (opts.minTickSize != null && size < opts.minTickSize) {
                size = opts.minTickSize;
            }

            axis.delta = delta;
            axis.tickDecimals = Math.max(0, maxDec != null ? maxDec : dec);
            axis.tickSize = opts.tickSize || size;

            // Time mode was moved to a plug-in in 0.8, and since so many people use it
            // we'll add an especially friendly reminder to make sure they included it.

            if (opts.mode == "time" && !axis.tickGenerator) {
                throw new Error("Time mode requires the flot.time plugin.");
            }

            // Flot supports base-10 axes; any other mode else is handled by a plug-in,
            // like flot.time.js.

            if (!axis.tickGenerator) {

                axis.tickGenerator = function (axis) {

                    var ticks = [],
                        start = floorInBase(axis.min, axis.tickSize),
                        i = 0,
                        v = Number.NaN,
                        prev;

                    do {
                        prev = v;
                        v = start + i * axis.tickSize;

View on GitHub (pinned to e815e74d4c)

Solutions

  1. Include jquery.flot.time.js after jquery.flot.js and before calling $.plot.
  2. Verify the plugin file loads (Network tab) and the filename/path is correct.
  3. Alternatively convert timestamps to plain numbers and format tick labels manually (not recommended).

Example fix

// before
<script src="jquery.flot.js"></script>
$.plot('#chart', data, { xaxis: { mode: 'time' } }); // throws

// after
<script src="jquery.flot.js"></script>
<script src="jquery.flot.time.js"></script>
$.plot('#chart', data, { xaxis: { mode: 'time' } });
Defensive patterns

Strategy: validation

Validate before calling

function flotTimeReady() {
  // flot.time registers its axis hooks; simplest proxy: check the script loaded
  return document.querySelector('script[src*="jquery.flot.time"]') != null;
}
if (opts.xaxis && opts.xaxis.mode === 'time' && !flotTimeReady()) {
  delete opts.xaxis.mode; // or abort with a clear message
}

Try / catch

try {
  $.plot('#chart', data, { xaxis: { mode: 'time' } });
} catch (e) {
  if (/flot\.time/.test(e.message)) {
    console.error('Include jquery.flot.time.js before plotting time axes');
  } else throw e;
}

Prevention

When it happens

Trigger: $.plot(el, data, { xaxis: { mode: 'time' } }) with only jquery.flot.js loaded; including jquery.flot.time.js after the $.plot() call (too late); a typo in the plugin filename so it 404s; bundling that drops flot.time.

Common situations: Upgrading flot from 0.7 (time mode was built-in) to 0.8+ without adding the new plugin file; time-series dashboards where the include list was hand-maintained.

Related errors


AI-assisted analysis of dianping/cat@e815e74d4c (2026-08-14). Data as JSON: /api/errors/7a380a68ff384513. Report an issue: GitHub.