Visualizes a data series as a graph, based on a associated data source.

This class can visualize an array of samples on a graph. You provide the data by subclasseing the IGraphViewDataSource to deliver to data to display.

This class only display the data, it does not hold or buffer it. In this sense the GraphView contains no state.


To demonstrate a simple example of using the GraphView we must also create a data source. For an associated data source, let us wrap a simple C array as a IGraphViewDataSource subclass:

// Subclass the IGraphViewDataSource interface
class DataSource : public IGraphViewDataSource

    // Use an internal array as data store
    uint8_t data[100];


    // Override the method that provide data samples
    int DataPoint(int index) { return data[index]; }

    // Override the method that return the total length of the data set
    int BufferLenght() { return 100; }

    // Override the method that return the valid value range of the data
    // samples.
    int MaxSampleValueSpan() { return 256; }

The class DataSource is just an array with a length of 100. Note that we only store 8-bit data samples (uint_t), therefore the valid data range is 256. The GraphView expects the data values to be signed, meaning the valid range is from -127 to +127.

We have not provided any methods for putting data into the data source, but we will skip that for this example.

Now, we can create a GraphView that displays data from the array:

// Crate the data source object
DataSource ds;

// The view rectangle, where the graph is displayed
mono::geo::Rect vRect(0,0,150,100);

// create the graph view, providing the display rect and data
mono::ui::GraphView graph(vRect, ds);

//tell the graph view to be visible;

Update Cursor

If you IGraphViewDataSource subclass overrides the method: NewestSampleIndex(), the GraphView can show an update cursor. The cursor is a vertical line drawn next to the latest or newest sample. The cursor is hidden by default, but you can activate it by overiding the data source method and calling setCursorActive.

Note that if you time span across the x-axis is less than 100 ms, the cursor might be annoying. I would recommend only using the cursor when your graph updates slowly.

Scaling and Zooming

the graoh view will automatically scale down the data samples to be display inside its graph area. It displays the complete data set from the data source, and does not support displaying ranges of the data set.

If you wish to apply zooming (either on x or Y axis), you must do that by scaling transforming the data in the data source. You can use an intermediate data source object, that scales the data samples, before sending them to the view.


Public Functions


Construct a GraphView with no viewRect and data source.

This contructor creates a GraphView object that needs a viewRect and source to be set manually.

You cannot display view objects that have a null-viewRect


GraphView::GraphView(geo::Rect rect)

Construct a GraphView with a defined viewRect.

This constructor takes a viewRect, that defines the space where graph is displayed.

**No data will be displayed before you set a valid source**

  • rect -

    The viewRect where the graph is displayed

GraphView::GraphView(geo::Rect rect, const IGraphViewDataSource &dSource)

Construct a GraphView with viewRect and a data source.

  • -

Protected Functions

virtual void GraphView::repaint()

Repaint the view content, using the View::painter.

Re-paint the view content. This method should be called when the view content has changed. You can call this method directly, but it might cause graphics artifacts because the display is not double buffered. Instead you should schedule a repaint by calling the scheduleRepaint() method. This method will schedule the repaint, right after the next display update.

The display system will not schedule any repaints automatically. The view does not contain any state information, so you or other classes utilizing view must schedule repaints.

In subclasses of View, this method must be overwritten.