JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="height: 400px; margin: auto; min-width: 310px; max-width: 600px"></div>

JavaScript

$(function () {
    Highcharts.chart('container', {
        chart: {
            zoomType: 'xy'
        },
        title: {
            text: 'Temperature vs Rainfall'
        },
        xAxis: [{
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        }],
        yAxis: [{ // Primary yAxis
            labels: {
                format: '{value} °C',
                style: {
                    color: Highcharts.getOptions().colors[1]
                }
            },
            title: {
                text: 'Temperature',
                style: {
                    color: Highcharts.getOptions().colors[1]
                }
            }
        }, { // Secondary yAxis
            title: {
                text: 'Rainfall',
                style: {
                    color: Highcharts.getOptions().colors[0]
                }
            },
            labels: {
                format: '{value} mm',
                style: {
                    color: Highcharts.getOptions().colors[0]
                }
            },
            opposite: true
        }],

        tooltip: {
            pointFormatter: function () {
                var errorSeries = this.series.chart
                        .series[this.series.index + 1],
                    errorPoint = errorSeries && errorSeries.points[this.index];

                var s = '<span style="font-weight: bold; color: {series.color}">' +
                    this.series.name + '</span>: <b>' + this.y + '</b>';

                if (errorPoint) {
                    s += ' (M.o.E.: ' + errorPoint.low + ' - ' + errorPoint.high + ')';
                    return s;
                }
            }
        },

        plotOptions: {
            errorbar: {
                tooltip: {
                    enabled: false
                }
            }
        },

        series: [{
            name: 'Rainfall',
            type: 'column',
            yAxis: 1,
        ...