JSFiddle - React, Tailwind, and code Playground

by Murali Kaliappan

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"></div>

JavaScript

$(function() {
  $.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function(data) {
    $('#container').highcharts('StockChart', {
      chart: {
        events: {
          load: function() {
            $('.highcharts-scrollbar').hide();
          }
        }
      },
      rangeSelector: {
        allButtonsEnabled: true,
        selected: 5
      },
      title: {
        text: 'Example chart'
      },
      navigator: {
        enabled: true
      },
      xAxis: {
        events: {
          afterSetExtremes: function() {
            var extr = this.getExtremes();
            if (extr.min === extr.dataMin && extr.max === extr.dataMax) {
              $('.highcharts-scrollbar').hide();
            } else {
              $('.highcharts-scrollbar').show();
            }
          }
        }
      },
       exporting:{
            chartOptions:{
                rangeSelector:{
                    enabled:false
                }
            }

        },
      series: [{
        data: data
      }]
    });
  });
});