Skip to content

Latest commit

 

History

History
 
 

Chart

Chart draws a chart of some metric, with a configurable window before and after the current point.

The default metric is alt, with a default window of 5 minutes (2.5 mins around the current point in each direction)

<component type="chart" name="chart" />

07-chart-0.png

The component used to be called 'gradient_chart', and type gradient_chart will still work, but is now deprecated and may be removed in a future version.

<component type="gradient_chart" name="chart" />

07-chart-1.png

Positioning

use x and y to set the position of the chart

<component type="chart" name="gradient_chart" x="100" />

07-chart-2.png

Window Size

Set the window size in seconds, defaults to 5*60 = 300.

Smaller windows have a bit more of a scroll effect, so look nicer.

<component type="chart" metric="speed" units="kph" seconds="30" />

07-chart-3.png

<component type="chart" metric="speed" units="kph" seconds="60" />

07-chart-4.png

<component type="chart" metric="speed" units="kph" seconds="90" />

07-chart-5.png

Metric & Units

Use any standard metric, with any standard unit. See 04-metrics for more details

<component type="chart" metric="speed" units="kph" />

07-chart-6.png

<component type="chart" metric="accl.x" units="m/s^2" />

07-chart-7.png

Colours / Sizing

Set the height using height

<component type="chart" height="100" />

07-chart-8.png

Set colours using bg, fill, line and text. These can be "r,g,b", or "r,g,b,a".

<component type="chart" bg="255,255,0" fill="0,255,255" line="255,0,255" text="0,0,255" />

07-chart-9.png

Set alpha/transparency using alpha, between 0 and 255.

<component type="chart" alpha="20" />

07-chart-10.png

<component type="chart" alpha="200" />

07-chart-11.png