Bubble labelling issue

by vasagi

HTML

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

CSS

#container {
  width: 744;
  height: 385px;
}

JavaScript

const data = [];
for (let i = 0; i < 200000; i++) {
    const date = new Date(2024, 0, 1 + i);
    data.push([date.getTime(), Math.random() * 100, Math.random() * 100]);
}
Highcharts.chart('container', {

		chart: {
      type: "bubble"
    },
    
    xAxis: {
    	min: 15,
      max: 70
    },
    
    yAxis: {
    	min: 0,
      max: 40
    },

    series: [{
    		type: "bubble",
        minSize: 16,
        maxSize: 16,
        data: [
        	{
          	x: 46,
            y: 23,
            labelText: "12"
          }          
        ],
        dataLabels: {
        	enabled: true,
          formatter: function() {
          	return  this.point.x;
          },
          style: {
          	fontSize: "11px",
          	textOutline: "none"
          }
        }
    }],
    title: {
        text: null
    }
});