JSFiddle - React, Tailwind, and code Playground

by Black Label

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>

<div id="container"></div>

JavaScript

Highcharts.chart('container', {

  chart: {
    type: "bubble"
  },

  yAxis: {
    min: 0,
    max: 5
  },

  plotOptions: {
    series: {
      clip: false,
      dataLabels: {
        overflow: 'allow',
        crop: false,
        enabled: true
      }
    }
  },

  series: [{
      data: [{
        x: 1,
        y: 5,
        z: 1
      }]
    },
    {
      data: [{
        x: 4,
        y: 4,
        z: 12
      }]
    },
    {
      data: [{
        x: 6,
        y: 3,
        z: 0
      }]
    },
    {
      data: [{
        x: 1,
        y: 2,
        z: 39
      }]
    },
    {
      data: [{
        x: 5,
        y: 1,
        z: 18
      }]
    },
    {
      data: [{
        x: 5,
        y: 0,
        z: 83
      }]
    }
  ]
});