JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container"></div>
JavaScript
$(function () {
var data_first = [32253, 64741, 58547, 47961, 53728, 63024, 36928],
data_second = [5386, 6141, 7195, 7648, 7587, 8450, 4609];
$('#container').highcharts({
chart: {
alignTicks: false
},
title: {
text: 'Title here'
},
xAxis: [{
categories: ['2009', '2010', '2011', '2012', '2013', '2014', '2015']
}],
yAxis: [{ // Primary yAxis
title: {
text: 'first'
},
gridLineColor: 'transparent'
}, { // Secondary yAxis
title: {
text: 'second'
},
opposite: true,
gridLineColor: 'transparent',
min: 0
}],
tooltip: {
shared: true
},
series: [{
name: 'first',
type: 'column',
data: data_first
}, {
name: 'second',
type: 'spline',
data: data_second,
yAxis: 1
}]
},function(chart){
chart.yAxis[1].update({max: chart.yAxis[0].getExtremes().max * 0.135});
});
});