JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://maps.googleapis.com/maps/api/js?v=3&amp;senseo=false&amp;ext=.js"></script>
<script src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/src/infobox.js"></script>
<script src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclustererplus/src/markerclusterer.js"></script>
<script src="http://jawj.github.io/OverlappingMarkerSpiderfier/bin/oms.min.js"></script>
<div id="map"></div>

CSS

#map {
    width: 500px;
    height: 500px;
}

JavaScript

var map = null;
var bounds = new google.maps.LatLngBounds();
var markerClusterer = new MarkerClusterer();
minClusterZoom = 14;
markerClusterer.setMaxZoom(minClusterZoom);
    var data = [{
      "id": "46322",
      "latitude": "49.4052788",
      "longitude": "2.8186893"
    }, {
      "id": "46323",
      "latitude": "49.4096945",
      "longitude": "2.8129819"
    }, {
      "id": "39195",
      "latitude": "49.290574",
      "longitude": "-0.108998"
    }, {
      "id": "39196",
      "latitude": "49.2910443",
      "longitude": " -0.10933479999994233"
    }, {
      "id": "39197",
      "latitude": "48.8704197",
      "longitude": " 2.3121386000000257"
    }, {
      "id": "39199",
      "latitude": "49.28998989999999",
      "longitude": " -0.10922389999996085"
    }, {
      "id": "39200",
      "latitude": "48.8704197",
      "longitude": " 2.3121386000000257"
    }, {
      "id": "39216",
      "latitude": "48.8718722",
      "longitude": " 2.3176432000000204"
    }, {
      "id": "39217",
      "latitude": "49.2571009",
      "longitude": " 2.4338401999999633"
    }, {
      "id": "39220",
      "latitude": "49.2577526",
      "longitude": " 2.435882900000024"
    }, {
      "id": "39221",
      "latitude": "49.2568023",
      "longitude": " 2.4363958999999795"
    }, {
      "id": "39222",
      "latitude": "49.262846",
      "longitude": " 2.4383007000000134"
    }, {
      "id": "39223",
      "latitude": "49.2568023",
      "longitude": " 2.4363958999999795"
    }];
    
function initialize() {
    var mapOptions = {
        center: new google.maps.LatLng(52, 8),
        zoom: 4
    };
    map = new google.maps.Map(document.getElementById('map'), mapOptions);

  	var oms = new OverlappingMarkerSpiderfier(map,{markersWontMove: true, markersWontHide: true, keepSpiderfied: true});

      var markers = [];
      for (var i = 0; i < data.length; i++) {
        var dataUser = data[i];
        var latLng = new google.maps.LatLng(dataUser.latitude,
        ...