JSFiddle - React, Tailwind, and code Playground

HTML

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

JavaScript

window.onload = function () {
  var chart = new CanvasJS.Chart("chartContainer",
                                 {
    title:{
      text: "Bubble Chart with text labels on X-Axis"
    },
    data: [
      {
        type: "bubble",
        dataPoints: [
          { label: "test1", y: 2.00, z:306.77 },
          { label: "test2", y: 2.15, z: 237.414 },
          { label: "test3", y: 1.86, z: 193.24 },
          { label: "test4", y: 2.36, z: 112.24 },
          { label: "test5", y: 5.56, z: 154.48 },
          { label: "test6", y: 1.54, z:141.91 }
        ]
      }
    ]
  });

  chart.render();
}