JSFiddle - React, Tailwind, and code Playground

HTML

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

JavaScript

var y = 0;
var data = [];
var dataSeries = { type: "line" };
var dataPoints = [];

dataPoints.push({
    y: 3000,
    label: '2014-05-06 12:02 PM'
   // x: '2014-05-06 12:02 PM'
    
});
dataPoints.push({
		//x: 10,
    y: 3100,
    label: '2014-06-06 12:02 PM'
    //x: '2014-06-06 12:02 PM'
});
dataPoints.push({
		//x: 14,
    y: 3500,
    label: '2014-07-06 12:02 PM'
    //x: '2014-07-06 12:02 PM'
});
dataPoints.push({
		//x: 26,
    y: 4000,
    label: '2014-08-06 12:02 PM'
    //x: '2014-08-06 12:02 PM'
});
dataSeries.dataPoints = dataPoints;
data.push(dataSeries);

//Better to construct options first and then pass it as a parameter
var options = {
    zoomEnabled: true,
    title: {
        text: "Try Zooming - Panning"
    },
    axisX: {
        labelAngle: -60,
    },
    axisY: {
        includeZero: false
    },
    data: data  // random data
};

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