Highcharts Demo
author(s):
Torstein Hønsi
by Christian Sonne
HTML
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/series-label.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
JavaScript
Highcharts.chart('container', {
chart: {
type: 'spline'
},
title: {
text: 'Snow depth at Vikjafjellet, Norway'
},
subtitle: {
text: 'Irregular time data in Highcharts JS'
},
xAxis: {
type: 'datetime',
dateTimeLabelFormats: { // don't display the dummy year
month: '%e. %b',
year: '%b'
},
title: {
text: 'Date'
}
},
yAxis: {
title: {
text: 'Snow depth (m)'
},
min: 0
},
tooltip: {
headerFormat: '<b>{series.name} op</b><br>',
pointFormat: '{point.x:%e. %b}: {point.y:.2f} m'
},
plotOptions: {
spline: {
marker: {
enabled: false
}
}
},
colors: ['#6CF', '#39F', '#06C', '#036', '#000'],
// Define the data points. All series have a dummy year
// of 1970/71 in order to be compared on the same x axis. Note
// that in JavaScript, months start at 0 for January, 1 for February etc.
series: [
{
"data": [
[
1565582400000,
4457.17
],
[
1565586000000,
4457.20875
],
[
1565589600000,
4457.31875
],
[
1565593200000,
4457.4366666666665
],
[
1565596800000,
4457.53625
],
[
1565600400000,
4457.631249999999
],
[
1565604000000,
4457.755
],
[
1565607600000,
4457.92375
],
[
1565611200000,
4458.045
],
[
1565614800000,
4458.1449999999995
],
[
1565618400000,
4458.264999999999
],
[
1565622000000,
null
],
[
1565625600000,
null
],
[
...