JSFiddle - React, Tailwind, and code Playground

HTML

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

JavaScript

var dataPoints = [];

var chart = new CanvasJS.Chart("chartContainer", {
  animationEnabled: true,
  theme: "light2",
  title: {
    text: "Line Chart from JSON"
  },
  data: [{
    type: "line",
    dataPoints: dataPoints
  }]
});

function addData(data) {
  for (var i = 0; i < data.columns["timestamp"].length; i++) {
    dataPoints.push({
      x: new Date(data.columns["timestamp"][i]),
      y: data.columns["latitude"][i]
    });
  }
  chart.render();

}

$.getJSON("https://api.myjson.com/bins/1eqjac", addData);