This article is outdated, you can access the most current version here: https://doc.onedata.de/apps/apps-docs/odml-documentation/AppBuilder/elements/HighchartsElement.html#type-highcharts
This is a sample configuration for a Bar & Line Chart in Apps.
{
"id": "barAndLineChart",
"type": "highcharts",
"source": "ice_cream_sales",
"config": {
"title": {
"text": "Bar chart with multiple yAxis"
},
"subtitle": {},
"exporting": {},
"chart": {
"type": "bar"
},
"series[0]": {
"type": "line"
},
"series": [
{
"columnName": "Ice_Cream_Sales",
"name": "Ice cream sales",
"turboThreshold": 0,
"yAxis": 0,
"type": "bar"
},
{
"columnName": "Temperature",
"name": "Temperature",
"turboThreshold": 0,
"yAxis": 1,
"type": "line"
}
],
"plotOptions": {
"series": {
"animation": false
}
},
"xAxis": [
{
"categories": [
"Day"
]
}
],
"yAxis": [
{
"title": {
"text": "Ice cream sales"
}
},
{
// this setting allows you to choose where your second yAxis
// should be: top (true); bottom, below first yAxis (false)
"opposite": true,
"title": {
"text": "Temperature"
}
}
]
}
}
Datasource used:
{
"id": "ice_cream_sales",
"origin": "raw",
"config": {
"schema": "table",
"data": [
{"Day": 1, "Temperature": 14.2, "Ice_Cream_Sales": 215},
{"Day": 2, "Temperature": 16.4, "Ice_Cream_Sales": 325},
{"Day": 3, "Temperature": 11.9, "Ice_Cream_Sales": 185},
{"Day": 4, "Temperature": 15.2, "Ice_Cream_Sales": 406},
{"Day": 5, "Temperature": 18.5, "Ice_Cream_Sales": 522},
{"Day": 6, "Temperature": 22.1, "Ice_Cream_Sales": 412},
{"Day": 7, "Temperature": 19.4, "Ice_Cream_Sales": 614},
{"Day": 8, "Temperature": 25.1, "Ice_Cream_Sales": 544},
{"Day": 9, "Temperature": 23.4, "Ice_Cream_Sales": 421}
]
}
},
Was this article helpful?
That’s Great!
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
Feedback sent
We appreciate your effort and will try to fix the article