HighChart boost
by Tam Thai
HTML
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/boost.js"></script>
<script src="https://highcharts.github.io/export-csv/export-csv.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
JavaScript
Highcharts.chart('container', {
tooltip: {
headerFormat: "<span style=\"font-size:10px\">{point.key}<table>",
pointFormat: "<tr><td style=\"color:{series.color};padding:0\">{series.name}: </td><td style=\"padding:0\"><b>{point.y:.f}</b></td></tr>",
footerFormat: "</table>",
useHTML: true,
crosshairs: [
true,
true
]
},
credits: {
"enabled": false
},
chart: {
"zoomType": "xy",
"type": "column",
},
xAxis: {
"type": "category",
"visible": true,
"title": {
"text": ""
},
"labels": {
"autoRotationLimit": 500
},
"categories": [
"656564234234T",
"575464563465R",
"767675567567W"
]
},
yAxis: {
"visible": true,
"title": {
"text": "Duration"
},
"gridLineWidth": 1
},
colors: [
"#66CCFF",
"#F15C80",
"#E5CCFF",
"#8085E9",
"#CCAF99",
"#E4D354",
"#2B908F",
"#F45B5B",
"#91E8E1",
"#F7A35C",
"#FF99FF",
"#CCAF99",
"#66ACFF",
"#90AD7D",
"#E5ACFF",
"#8015E9",
"#F10C80",
"#E4A354",
"#2B108F",
"#F40B5B",
"#91I8E1",
"#F7035C",
"#FF19FF",
"#CCAF99"
],
title: {
"text": "Bar Chart"
},
legend: {
"enabled": true
},
plotOptions: {
"column": {
"stacking": "",
"dataLabels": {
"enabled": false,
"color": "#7A7A7A",
"format": "{point.y:.f}",
"rotation": -90,
"y": 0,
"crop": false
}
},
"line": {
"dataLabels": {
"enabled": false,
"color": "#7A7A7A",
"format": "{point.y:.f}",
"rotation": -90,
"y": 0
}
}
},
exporting: {
"csv": {
"itemDelimiter": ";"
},
fallbackToExportServer: false,
buttons: {
"contextButton": {
"menuItems": [{
"text": "Print chart"
}, {
"separator": true
}, {
"text": "Download PNG image"
}, {
...