JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<div id="chartContainer" style="height: 370px; width: 1000px;overflow:visible;"></div>
</body>
</html>

JavaScript

var chart = new CanvasJS.Chart("chartContainer",
    {
      title: {
        text: "Custom Labels on X Axis "
      },
      zoomEnabled: true,
      data: [
      {
        type: "line",
        dataPoints: [

        { y: 71, x: 1},
        { y: 55, x: 2},
        { y: 50, x: 3},
        { y: 65, x: 4},
        { y: 95, x: 5},
        { y: 68, x: 6},
        { y: 28, x: 7},
        { y: 34, x: 8},
        { y: 14, x: 9}
        ]
      }
      ]
    });

    chart.render();