JSFiddle - React, Tailwind, and code Playground

by grant

HTML

<script src="https://maps.googleapis.com/maps/api/js"></script>
<script src="https://www.patrick-wied.at/static/heatmapjs/assets/js/gmaps-heatmap.js"></script>
<div class="heatmap" id="map-canvas">
</div>

JavaScript

var map, pointarray, heatmap;
   
 var taxiData = [
 {location: new google.maps.LatLng(37.782, -122.447), weight: 10},
  new google.maps.LatLng(37.782, -122.445),
  {location: new google.maps.LatLng(37.782, -122.443), weight: 2},
  {location: new google.maps.LatLng(37.782, -122.441), weight: 3},
  {location: new google.maps.LatLng(37.782, -122.439), weight: 2},
  new google.maps.LatLng(37.782, -122.437),
 ];
 var map;
function initMap() {

    var styleArray = [
        {
            featureType: 'all',
            stylers: [
                { saturation: -80 }
            ]
        }, {
            featureType: 'road.arterial',
            elementType: 'geometry',
            stylers: [
                { hue: '#00ffee' },
                { saturation: 50 }
            ]
        }, {
            featureType: 'poi.business',
            elementType: 'labels',
            stylers: [
                { visibility: 'off' }
            ]
        }
    ];

    var mapOptions = {
        zoom: 12,
        center: new google.maps.LatLng(6.3088468, 5.6223226),
        styles: styleArray
    };

    var map = new google.maps.Map(document.getElementById('map-canvas'),
        mapOptions);
        // Load GeoJSON.
    //map.data.loadGeoJson('https://gist.githubusercontent.com/vgrem/4d6ff14d50f408e864f1ee4614653c1c/raw/schools.geojson');
pointArray = new google.maps.MVCArray(taxiData);
   
    heatmap = new google.maps.visualization.HeatmapLayer({
          data: pointArray
        });

        heatmap.setMap(map);
      
      
/*      map.data.loadGeoJson('https://gist.githubusercontent.com/vgrem/4d6ff14d50f408e864f1ee4614653c1c/raw/schools.geojson', null, function (features) {

        var markers = features.map(function (feature) {
            var g = feature.getGeometry();
            var marker = new google.maps.Marker({ 'position': g.get(0) });
            return marker;
        });
*/
        var markerCluster = new MarkerClusterer(map, markers,{ imagePath:...