AQ Graph

Basic X/Y plot

Doing a basic plot requires just a couple of lines.

The process for graphing is first to make an instance of the graphing method, in this case the min/max class. Then the instance is ready to graph data just by calling the render function. The graph will use all default parameters because none have been specified.

Basic plot as points

Points can be added. Large points can be useful for small data sets. Small points can be used in place of min/max lines.

Large data sets

Min/Max graphs are designed to handle large data sets. In this example a data set with 6,000 points will be displayed in a graph 1/10th the width.

The red line represent the minimum and maximum data values for each point on the graph, while the blue line represents the average for that location.

Another item to note is that the X axis data is optional. If omitted, it is assumed each data point in Y is equally spaced in X.

Points instead of min/max

Rather than just plot the min/max as lines, a point cloud can be displayed.

This example visually demonstrates the Gaussian distribution of the data.

Aliasing

Aliasing can cause a signal to become hidden if the width of the graph aligns with the frequency being graphed.

In this graph, two lower frequencies of 2 and 5 Hz exist with 600 Hz. Because the graph if exactly 600 pixels wide this high frequency does not show up in the average plot due to aliasing. However, there is clearly a higher frequencies because the min/max red band.

Margins and Parameters

To add margins we need to make use of the parameters. This is a dictionary of options passed to the graphing function.

The margins and inner board width are defined in the parameter, overriding the default which have no margin or border. This is typical method for specifying how the graph looks.

Area fill

Using an area rather than a line.

Divisions and Labels

Divisions and labels are usually necessary for graphs. There are two options for making divisions: setting xScaleMajorEvery/yScaleMajorEvery or xScaleMajor/yScaleMajor. The ?ScaleMajorEvery parameter will override the ?ScaleMajor if both are specified. Use ?ScaleMajorEvery when to count by a specific value, such as labeling every 10 units. Use the ?ScaleMajor to divide the graph into ?ScaleMajor equal parts.

Note that is X data is omitted, and X scale will simply use the index of the data in Y and assume the X data is equally space. Omitting X data can save memory which can be useful for large data sets.

Data Gaps

Gaps in data can be shown by settings the maxX_Distance parameter. This value represents the maximum spacing between two points in x before a line is not drawn.

Naturally, this is only useful for X/Y data as Y-only data always has equal spacing between points.

Setup for fast redraw

When continuously rendering large data sets it makes sense to initialize the divisions first and then redraw data over top this. Doing this is a couple step process. First, initialize the divisions. Then when it is time to update the data, erase the canvas, reset the divisions, and render the new data.

Custom labels

A custom callback can be define for axis labels. It is passed the value of the data point to label and displays whatever is returned by the function.

Note that is X data is omitted, and X scale will simply use the index of the data in Y. Custom label functions can assume this to be the case.

Bar Graphs

Simple vertical bar graphs.

Notice that the data parameter is wrapped in an array. This is because the graphing function can take more than one data set as an input.

Multiple Bar Graphs

Multiple bar graphs can be accomplished simply by adding additional data elements to the data parameter.

The divisions and labels work the same as min/max graphs.

Bar Graphs Centering

Centering is an option that states where the bars start from and either move above or below this line. By default the center is 0.