rrdFlotSupport module


The rrdFlotSupport Javascript module implements a set of commonly used functions an classes that may be used while plotting RRD files with Flot.


Overview

This module provides two types of support:

Function rrdDS2FlotSeries

This function extracts a specific DS from a specific RRA and returns an object that contains the data in format flot expects.

Input parameters:

Parameter

Description

rrd_file

An object of type RRDFile or equivalent.

ds_id

Identifier of the desired DS (as accepted by RRDFile.getDS()).

rra_idx

Index of the desired RRA.

want_rounding

If not false, all timestamps will be truncated to the RRA step.

The output is an object containing:

Attribute

Description

data

A list of datapoints suitable to be fed to Flot. Each element is a (Timestamp in ms, value) pair.

An example of use with Flot:

var fd=rrdDS2FlotSeries(...);
var plot = $.plot("#myplot", [{data:fd.data}], options);

label

The DS name.

min

Min and max timestamp in ms.

max

Function rrdDS2FlotObj

This function extracts a set of DSs from a specific RRA and returns an object that contains the data in format flot expects.

Input parameters:

Parameter

Description

rrd_file

An object of type RRDFile or equivalent.

rra_idx

Index of the desired RRA.

ds_list

List of DS identifiers (as accepted by RRDFile.getDS()).

want_label

Should the DS name be included as label in the output? (If false, only the order distinguishes the requested DSs)

want_rounding

If not false, all timestamps will be truncated to the RRA step.

The output is an object containing:

Attribute

Description

data

A list of objects suitable to be fed to Flot. Each element is an object composed of two attributes:

  • data - A list of (Timestamp in ms, value) pairs.
  • label - The (optional) DS name.

An example of use with Flot:

var fd=rrdDS2FlotObj(...);
var plot = $.plot("#myplot", fd.data, options);

min

Min and max timestamp in ms.

max

Class rrdFlotSelection

Helper class to handle Flot selections.

Method

Description

reset()

Clear the selection. (isSet() will return False)

isSet()

Was a selection set?

setFromFlotRanges(ranges)

Set the selection to ranges.xaxis. See plotselected Flot event for more info on ranges. (isSet() will return True, and getFlotRanges() can now be called.)

getFlotRanges()

Return a ranges object. See plotselected Flot event for more info on ranges.

trim_flot_data(flot_data)

Create a new Flot data object by selecting only the data points within the current selection.

An example Flot data object is

rrdDS2FlotObj(...).data

trim_data(data_list)

Create a new data list by selecting only the data points within the current selection.

An example data list is

rrdDS2FlotSeries(...).data

Pseudo-example of use:

  myplotplot.bind("plotselected", function (event, ranges) {
      // do the zooming
      selection_range.setFromFlotRanges(ranges);
      graph_options.xaxis.min=ranges.xaxis.from;
      graph_options.xaxis.max=ranges.xaxis.to;
      mygraph = $.plot("#mygraph", selection_range.trim_flot_data(flot_data), graph_options);
  });