rrdFlot module


The rrdFlot Javascript module implements a class used to represents a RDD archive as a Flot plot. Tooltips are provided by the tooltip plugin.


Overview

This module provide a single class: rrdFlot.

Given a RRDFile object, this class creates an interactive Flot plot.

In order to use this module, you also need to include:

Class rrdFlot

The rrdFlot constructor has two to four arguments:

Argument

Description

html_id

ID of a HTML element, possibly a DIV.

rrd_file

An object of type RRDFile, or equivalent.

graph_options (optional)

Global graphing options. See Flot documentation and tooltip plugin documentation for more details.

The recognized elements and the default values are:

  graph_options = {
    legend: {position:"nw",noColumns:3},
    lines: { show:true },
    yaxis: { autoscaleMargin: 0.20},
    tooltip: true,
    tooltipOpts: { content: "<h4>%s</h4> Value: %y.3" }, // %s: series text, %y.3: y-value toPrecision(3)
  };

ds_graph_options (optional)

Dictionary of graphing options. This must be a dictionary of DS_id. Each element of the dictionary contains graphing options. See Flot documentation for more details.

The recognized elements and the default values are:

   {
     title: label  or ds_name     // this is what is displayed in the checkboxes
     checked: first_ds_in_list?   // boolean
     label: title or ds_name      // this is what is displayed in the legend
     color: ds_index              // see Flot docs for details
     lines: { show:true }         // see Flot docs for details
     yaxis: 1                     // can be 1 or 2
     stack: 'none'                // other options are 'positive' and 'negative'
   }

rrdflot_defaults (optional)

Dictionary of rrd_flot options. All are optional.

The recognized elements and the default values are:

   {
     graph_only: false        // If true, limit the display to the graph only
     legend: "Top"            //Starting location of legend. Options are: 
                              //   "Top","Bottom","TopRight","BottomRight","None".
     num_cb_rows: 12          //How many rows of DS checkboxes per column.
     use_elem_buttons: false  //To be used in conjunction with num_cb_rows: This option
                              //    creates a button above every column, which selects
                              //    every element in the column. 
     multi_ds: false          //"true" appends the name of the aggregation function to the 
                              //    name of the DS element. 
     multi_rra: false         //"true" appends the name of the RRA consolidation function (CF) 
                              //    (AVERAGE, MIN, MAX or LAST) to the name of the RRA. Useful 
                              //    for RRAs over the same interval with different CFs.  
     use_checked_DSs: false   //Use the list checked_DSs below.
     checked_DSs: []          //List of elements to be checked by default when graph is loaded. 
                              //    Overwrites graph options. 
     use_rra: false           //Whether to use the rra index specified below.
     rra: 0                   //RRA (rra index in rrd) to be selected when graph is loaded. 
     use_windows: false       //Whether to use the window zoom specifications below.
     window_min: 0            //Sets minimum for window zoom. X-axis usually in unix time. 
     window_max: 0            //Sets maximum for window zoom.
     graph_height: "300px"    //Height of main graph. 
     graph_width: "500px"     //Width of main graph.
     scale_height: "110px"    //Height of small scaler graph.
     scale_width: "250px"     //Width of small scaler graph.
     timezone: local time     //Timezone to plot. Options are -11 through +12
  } 

See the rrdflot_defaults in action.

Once instatiated, the object will automatically draw the plot and handle user interaction.


This module is part of the javascriptRRD package hosted at http://javascriptrrd.sourceforge.net.
It is licensed under the MIT license.