JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://maps.googleapis.com/maps/api/js?v=3"></script>
<div id="map_canvas"/>

CSS

html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #map_canvas { height: 100% }

JavaScript

function initialize() {
        var locations = [
  ['Message 1', -33.890542, 151.274856, 4, 'leeds'],
  ['Message 2', -33.923036, 151.259052, 5 , 'manchester'],
  ['Message 3', -34.028249, 151.157507, 3 , 'london'],
  ['Message 4', -33.80010128657071, 151.28747820854187, 2, 'newcastle'],
  ['Message 5', -33.950198, 151.259302, 1, 'birmingham']
];
map = new google.maps.Map(document.getElementById("map_canvas"), {zoom:0,center:new google.maps.LatLng(0,0)});
geocoder=new google.maps.Geocoder();
address='london';
if (geocoder) {
  geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
      map.setCenter(results[0].geometry.location);

        var infowindow = new google.maps.InfoWindow();
        var image = {
            url: 'assets/img/banners/404.png',
            // This marker is 20 pixels wide by 32 pixels tall.
            size: new google.maps.Size(20, 32),
            // The origin for this image is 0,0.
            origin: new google.maps.Point(0,0),
            // The anchor for this image is the base of the flagpole at 0,32.
            anchor: new google.maps.Point(0, 32)
          };
        var marker;





        for (var x = 0; x < locations.length; x++) {

            geocoder.geocode({address:locations[x][4]},
                             (function(x){
                                return function(data,status){
                                 if (status == google.maps.GeocoderStatus.OK) {

                                  marker = new google.maps.Marker({
                                    position: data[0].geometry.location,
                                    map: map
                                  });

                                  google.maps.event.addListener(marker, 'click', 
                                    (function(marker, x) {
                
                                      return...