JSFiddle - React, Tailwind, and code Playground

by Kesav Telaprolu

HTML

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


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

JavaScript

$(function() {
  $('#container').highcharts('StockChart', {
    xAxis: [{
      title: {
        text: 'Pressure'
      },
      height: '50%',
      lineWidth: 2
    }, {
      title: {
        text: 'Temperature'
      },
      top: '50%',
      height: '50%',
      offset: 0,
      lineWidth: 2
    }],
    series: [{
      type: 'column',
      name: 'Pressure',
      data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 6, 3, 2, 4, 6, 3, 1],
    }, {
      type: 'spline',
      name: 'TemperatureIn',
      data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 6, 3, 2, 4, 6, 3, 1],
     xyAxis: 1,
    }, {
      type: 'spline',
      name: 'TemperatureOut',
      data: [2, 3, 4, 5, 6, 2, 3, 4, 5, 2, 1, 3, 5, 3, 2, 1],
      xAxis: 1,
    }]
  });
});