JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://canvasjs.com/assets/script/jquery.canvasjs.stock.min.js"></script>
<div id="chartContainer" style="height: 250px; width: 100%;"></div>
<img id="loader" src="https://canvasjs.com/wp-content/uploads/images/gallery/javascript-stockcharts/overview/loading.gif" style="position: absolute; top: 150px; left: 48%; display: none"/>

CSS

#chartContainer .canvasjs-chart-tooltip {
  display: none !important;
}

JavaScript

// Event handlers

var priceData = [], volumeData = [], sliderData = [];
var stockChart = new CanvasJS.StockChart("chartContainer", {
  exportEnabled: false,
  theme: "light1",
  title: {text: "My chart"},
  rangeSelector: {
    enabled: true,
    inputFields: {enabled: false},
    buttons: [
      {
        label: "1m",
        range: 1,
        rangeType: "minute",
      },
      {
        label: "3m",
        range: 3,
        rangeType: "minute",
      },
      {
        label: "5m",
        range: 5,
        rangeType: "minute",
      },
      {
        label: "15m",
        range: 15,
        rangeType: "minute",
      },
      {
        label: "30m",
        range: 30,
        rangeType: "minute",
      },
      {
        label: "1h",
        range: 1,
        rangeType: "hour"
      },
      {
        label: "4h",
        range: 4,
        rangeType: "hour"
      },
      {
        label: "1D",
        range: 1,
        rangeType: "day"
      },
      {
        label: "All",
        rangeType: "all"
      }

    ]
  },

  navigator: {
    enabled: true,
    data: [{dataPoints: sliderData}],
    slider: {
      minimum: new Date(2018, 4, 1),
      maximum: new Date(2018, 6, 1)
    }
  },
  charts: [
    // PRICE DATA
    {
      toolTip: {
        /* enabled: false, */
        shared: true
      },
      axisX: {
        lineThickness: 5,
        tickLength: 0,
        labelFormatter: function (e) {
          return " ";
        },
        crosshair: {
          enabled: true,
          snapToDataPoint: false,
          labelFormatter: function (e) {
            return ""
          }
        }
      },
      axisY2: {
        title: "",
        prefix: "$",
        crosshair: {
          enabled: true,
          hidden:function(){console.log("hidden")},
          snapToDataPoint: false,
          labelFormatter: function (e) {
            //Returns price relative to the openprince of the first visible candle
            return (((e.value /...