JSFiddle - React, Tailwind, and code Playground

by Fusher

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>


<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>

JavaScript

$(function () {
    var chart;

    $(document).ready(function() {

        var options = {
            chart: {
                renderTo: 'container',
                type: 'scatter',
            },
            title: {
                text: ''
            },
            xAxis: {
                minPadding: 0.1,
                maxPadding: 0.1
            },
            yAxis: {
                                     gridLineWidth: 0,
                minPadding: 0.1,
                maxPadding: 0.1
            }
        };
                                     var points = [];
                                     for (var i = 0; i < 12; i++) {
            for (var j = 0; j < 12; j++) {
            points.push({
            x: i,
            y: j,
            radius: Math.floor(Math.random()*(i+j+1))
            });
    }
    }
                      options.series = [{events: {hover: { enabled: false }}, data: points}];
                                     
                                     chart = new Highcharts.Chart(options);
    });
});