Description
The ChartBuilder component allows you to build a chart dynamically.
Implementation
- Copy / paste the component into the station.
- Edit the properties in the view.
- Save and see the result.
- After building the chart you can display it in a card ChartBuilder
This component is for advanced chart building.
It is the responsibility of the user to see how Highcharts configurations works, please refer to the official API here.
Most of the example in Highcharts API are Javascript syntax. Fix the configuration to JSON syntax to make the ChartBuilder works.
The current version of Highchart used is the 7.1.3, we do not support newest features.
Properties
- Enable dateTime: Adds datetime for values. If enable, add
type
field withdatetime
value toxAxis
configuration - Constructor Type: The type of constructor highcharts you want to use. The constructor here is the library to take constructor from, 4 possibilities:
charts
for Highcharts chartsstockChart
for Highstock chartsmapChart
for Highmaps chartsganttChart'
for Gantt charts
- Data: The bql requests to resolve the data to display
- CSS: An additional style to apply to the chart view
- JSON: The JSON configuration for the chart. It isn't allowed to use Javascript in it like the
Highchart
object. To add custom data to the chart, follow this steps:- Add as many request you want in data field
- Add as many series configuration in your JSON
- Add
series
field configuration, and for the value use the syntax"$chart_dataI"
. ReplaceI
by the index of the data request you want to replace, starting by 0. For example$chart_data0
for the first data request A full example of JSON :