JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.canvasjs.com/canvasjs.min.js"></script>
<br/><!-- Just so that JSFiddle's Result label doesn't overlap the Chart -->
<div id="chartContainer" style="height: 360px; width: 100%;"></div>

JavaScript

const options = {
  animationEnabled: true,
  axisX: {
    valueFormatString: "MMM"
  },
  data: [{
    xValueFormatString: "MMMM",
    type: "spline",
    dataPoints: [
      { x: new Date(2017, 0), y: 250 },
      { x: new Date(2017, 1), y: 279 },
      { x: new Date(2017, 2), y: 428 },
      { x: new Date(2017, 3), y: 324 },
      { x: new Date(2017, 4), y: 352 },
      { x: new Date(2017, 5), y: 339 },
      { x: new Date(2017, 6), y: 400 },
      { x: new Date(2017, 7), y: 525 },
      { x: new Date(2017, 8), y: 323 },
      { x: new Date(2017, 9), y: 420 },
      { x: new Date(2017, 10), y: 371 },
      { x: new Date(2017, 11), y: 384 }
    ]
  }]
}

var chart = new CanvasJS.Chart("chartContainer", options);
chart.render();