JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://maps.google.com/maps/api/js?sensor=false&amp;.js"></script>
<script src="https://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/src/markerclusterer.js"></script>
<div id="map_canvas"></div>

CSS

#map_canvas{
    width: 600px;
    height: 500px;
}

JavaScript

var map;
var global_markers = [];
var markers = [
	[37.09024, -95.712891, 'trialhead0'],
	[37.09024, -95.712891, 'trialhead1'],
	[37.09024, -95.712892, 'trialhead2']
];
var infowindow = new google.maps.InfoWindow({});

function initialize() {
	geocoder = new google.maps.Geocoder();
	var latlng = new google.maps.LatLng(40.77627, -73.910965);
	var myOptions = {
		zoom: 1,
		center: latlng,
		mapTypeId: google.maps.MapTypeId.ROADMAP
	}
	map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
	addMarker();
}

function addMarker() {
	for (var i = 0; i < markers.length; i++) {
		// obtain the attribues of each marker
		var lat = parseFloat(markers[i][0]);
		var lng = parseFloat(markers[i][1]);
		var trailhead_name = markers[i][2];
		var myLatlng = new google.maps.LatLng(lat, lng);
		var contentString = "<html><body><div><p><h2>" + trailhead_name + "</h2></p></div></body></html>";
		var marker = new google.maps.Marker({
			position: myLatlng,
			map: map,
			title: "Coordinates: " + lat + " , " + lng + " | Trailhead name: " + trailhead_name
		});
		marker['infowindow'] = contentString;
		global_markers[i] = marker;
		global_markers.push(marker);
		google.maps.event.addListener(global_markers[i], 'click', function() {
			infowindow.setContent(this['infowindow']);
			infowindow.open(map, this);
		});
	}
}
var markerCluster = new MarkerClusterer(map, global_markers);
window.onload = initialize;