JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="height: 400px; min-width: 310px; max-width: 600px; margin: 0 auto"></div>
JavaScript
$(function () {
$('#container').highcharts({
chart: {
type: 'bubble',
zoomType: 'xy',
height: 500,
width: 500,
},
title: {
text: 'Highcharts Bubbles'
},
yAxis: {
min: 0,
max: 5,
gridLineWidth: 1,
},
xAxis: {
min: 0,
max: 5,
gridLineWidth: 1,
},
series: [{
data: [[5, 4, 2], [3, 1, 1], [4, 2, 3], [1, 2, 3], [1, 4, 1], [2, 5, 1], [5, 2, 3], [3, 2, 1]]
}]
});
});