JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://canvasjs.com/assets/script/jquery-1.11.1.min.js"></script>
<script src="https://cdn.canvasjs.com/canvasjs.stock.min.js"></script>
<div id="chartContainer" style="height: 450px; width: 100%;"></div>

JavaScript

window.onload = function () {
  var dataPoints = [];

  var stockChart = new CanvasJS.StockChart("chartContainer",{
    title: {
      text: "StockChart with Date-Time Data"
    },
    exportEnabled: true,
    charts: [{      
      data: [{        
        type: "line", //Change it to "spline", "area", "column"
        dataPoints : dataPoints
      }]
    }],
    navigator: {
      slider: {
        minimum: new Date(2018,04, 01),
        maximum: new Date(2018,06, 01)
      }
    }
  }); 

  $.getJSON("https://canvasjs.com/data/docs/btcusd2018.json", function(data) {  
    for(var i = 0; i < data.length; i++){
      dataPoints.push({x: new Date(data[i].date + "T00:00:00"), y: Number(data[i].close)});
    }

    stockChart.render();
  });
}