JSFiddle - React, Tailwind, and code Playground
by grant
HTML
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
JavaScript
$(function () {
$('#container').highcharts({
chart: {
renderTo: 'container'
},
xAxis: [{
type: 'datetime'
}],
yAxis: [{
opposite: true,
lineWidth: 1
},{
opposite: true,
lineWidth: 1
}],
plotOptions: {
series: {
}
},
series: [{
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
pointStart: Date.UTC(2010, 0, 1),
pointInterval: 24 * 3600 * 1000, // one day
yAxis: 1
}, {
data: [20000, 2250, 30300, 28000, 27000, 27800, 25800],
pointStart: Date.UTC(2010, 0, 3),
pointInterval: 24 * 3600 * 1000, // one day
dataLabels: {
enabled: true,
formatter: function(){
var isLast = false;
if(this.point.x === this.series.data[this.series.data.length -1].x && this.point.y === this.series.data[this.series.data.length -1].y) isLast = true;
return isLast ? this.y : '';
}
}
}]
});
});