JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://maps.googleapis.com/maps/api/js?sensor=false&amp;libraries=geometry,places&amp;ext=.js"></script>
<div id="default" style="width:100%; height:100%"></div>

CSS

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

JavaScript

var locations = [
    ['loan 1', 46.166621, 8.853315, '<div style="width:250px">text info 1'],
    ['loan 2', 46.173000, 8.856315, '<div style="width:250px">text info 2'], ];

function initialize() {
    var myOptions = {
        center: new google.maps.LatLng(46.166621, 8.853315),
        zoom: 15,
        mapTypeId: google.maps.MapTypeId.SATELLITE
    };

    var map = new google.maps.Map(document.getElementById("default"), myOptions);
    setMarkers(map, locations);
}

function setMarkers(map, locations) {
    var marker, i

    for (i = 0; i < locations.length; i++) {
        var loan = locations[i][0]
        var lat = locations[i][1]
        var long = locations[i][2]
        var add = locations[i][3]

        latlngset = new google.maps.LatLng(lat, long);

        var marker = new google.maps.Marker({
            map: map,
            title: loan,
            position: latlngset
        });
        map.setCenter(marker.getPosition())

        var content = add
        var infowindow = new google.maps.InfoWindow()
        google.maps.event.addListener(marker, 'click', (function (marker, content, infowindow) {
            return function () {
                infowindow.setContent(content);
                infowindow.open(map, marker);
            };
        })(marker, content, infowindow));
        google.maps.event.trigger(marker, 'click', {});
    }
}
google.maps.event.addDomListener(window, 'load', initialize);