Skip to main content

Plot

Plot arbitrary numeric values from topic message paths.

When playing back local or remote data files, this panel will load the data belonging to the specified topic message paths for the whole playback timeline. Current playback time is indicated by a vertical gray bar.

add series

Settings

General

fielddescription
X-axis value type

Source of data for values plotted on the x-axis:

  • A timestamp for time series plots
  • A message path for XY plots
  • The index of the value in its array
These options are described in more detail below.
Sync with other plotsFor timestamp-based plots. Sync timeline to other Plot and State Transitions panels.
Axis scales

For path-based XY plots.

Independent (the default) lets you configure min and max values for the X and Y axis scales independently.

1:1 is useful for when X and Y have the same units, and will keep the scales locked together. It hides the min/max axis settings and always zooms both axes simultaneously.

Legend

fielddescription
PositionPosition of the legend in relation to the chart (Floating, Left, Top)
Show legendDisplay the legend
Show valuesShow the corresponding y value next to each series in the legend (either at the current playback time or at a point on user hover)

X-axis

fielddescription
Default values pathFor path-based values: the message path containing default x-axis values for the series. You can also set these individually for each series.
Axis labelLabel displayed for the x-axis
Show tick labelsWhether or not to display numeric values for x-axis tick marks
MinFixed minimum value for x-axis
MaxFixed maximum value for x-axis
Range (seconds)For time series data: amount of data to visualize following behind the current playback point time

Time series plots

The default Timestamp option plots y-values against incoming messages' log times. All time series Plot and State Transitions panels in a given layout can be kept in sync for easy comparison.

XY plots

The Path (current) and Path (accumulated) modes produce XY scatter plots where both y-values and x-values are extracted from message paths. Using message path syntax, specify the path to the x-axis data, e.g. /some_topic.position.x and each series will pair the corresponding y-axis data, e.g. /some_topic.position.y. You can specify x-values either per-series, or globally for all series.

"Path (accumulated)" will plot data from all messages in the dataset:

plot with path x-axis - accumulated

"Path (current)" will plot the instantaneous data from the current playback message. This can be either a single value or an array of values:

plot with path x-axis - current

Index-based plots

This mode plots instantaneous data from an array in the current playback message using the array's index as the x-axis value. For example, if /some_topic.some_array contained the values [5, 10, 15] in a particular message, the resulting points on the chart would be [0, 5], [1, 10], and [2, 15] at that point in time.

Y-axis

fielddescription
Axis labelLabel displayed for the y-axis
Show tick labelsWhether or not to display numeric values for y-axis tick marks
MinFixed minimum value for y-axis
MaxFixed maximum value for y-axis

Series

fielddescription
LabelLabel displayed for the series in the legend
X-value pathFor XY plots: message path containing x-axis values for the series. Overrides default x-axis values if set.
Y-value pathMessage path containing y-axis values for the series
ColorColor used to plot the series
Line sizeWidth of line connecting data points
Show lineShow line connecting data points. (Not applicable to reference lines.)
TimestampTimestamp used for message ordering. (Not applicable to reference lines.)

Use the panel settings to add, edit, or remove data series. Use the "X" next to each data series in settings or the plot legend to remove the series.

add series

Enter the field or slice of data you would like plotted on the y-axis using message path syntax as a Series. Entering a single number will create a horizontal line at that value.

If you enter a message path that points to multiple values (e.g. /some_topic/some_array[:].x), the plot will display multiple values each x-axis tick.

Each series can be configured to display a descriptive label via the Label field in settings.

Plot panel settings

For time series plots, is possible to choose between log, publish, or header stamp time for each series.

plot with timestamp x-axis

User interactions

Pan and Zoom

Scroll to zoom, and drag to pan. By default, scrolling will zoom horizontally only. To zoom vertically, hold v while scrolling. To zoom horizontally and vertically at the same time, hold b while scrolling. Click the "reset view" button or double-click the panel to reset to the original viewport.

Click-to-seek

Only available for data sources which support seeking.

Hover over any point on the plot to see its details in a tooltip. You'll see a vertical yellow bar appear, as well as a corresponding yellow marker at the same on the playback timeline. Click to seek playback to the yellow marker on the timeline.

Download CSV data

Right-click the plot to download the plotted data as a .csv file.

Math modifiers

The following Math functions are available to append to your Plot panel's message paths:

  • .@abs
  • .@acos
  • .@asin
  • .@atan
  • .@ceil
  • .@cos
  • .@derivative
  • .@log
  • .@log1p
  • .@log2
  • .@log10
  • .@negative
  • .@round
  • .@sign
  • .@sin
  • .@sqrt
  • .@tan
  • .@trunc

Note that .@derivative will not work with scatter plots (i.e. message paths that point to an array of values for each x-axis tick).

See the Javascript Math documentation for more details.

Reference lines

To add a reference line at a constant value in a plot panel, add a series and set the message path to the constant value you would like plotted.

plot with reference value

Downsampling

To improve performance, the Plot panel will downsample data when points are too dense to meaningfully display.

Times series plots

In timestamp mode, the Plot panel will downsample data using a min/max/first/last downsampling algorithm. This downsampling will preserve extremes so even when downsampled, the plot will still show the highest and lowest values for each time period. The points kept during downsampling will always be from the original data — downsampling does not interpolate or create new points.

When data is downsampled, the Plot panel will automatically hide the dots for your data and only show lines. You can zoom until you see dots indicating you are seeing the full original data.

XY plots

In path-based modes, the Plot panel will use different downsampling approaches depending on the "Show lines" setting for the series.

If the series does not have lines enabled, downsampling will remove points which occur at the same pixel location as other points. The rendered plot will look the same as one with no downsampling.

If the series has lines enabled, downsampling will preserve the shape of the data and only remove points which would not alter the shape. When data is downsampled, the Plot panel will automatically hide the dots for your data and only show lines. You can zoom until you see dots indicating you are seeing the full original data.

Shortcuts

  • Scroll – Zoom in and out horizontally
  • v + Scroll – Zoom in and out vertically
  • b + Scroll – Zoom in and out both horizontally and vertically