ProcessWire Google Map.php

echo "\n\n<div id='map'></div>"; //div to show in template map


$js = "<script type='text/javascript'>";

$js .= "RCDMap.options.zoom = 2;";
$js .= "RCDMap.init('map', 0, 0);";

foreach($page->children as $items) {
  $cat = $items->category ? $items->category->name : 'default-icon'; //Uses a field called category for icon.
  $js .= "\nRCDMap.addMarker('{$items->title}', '{$items->url}', {$items->map->lat}, {$items->map->lng}, '{$cat}');";
}
$js .= "RCDMap.fitToMarkers();";

$js .= "</script>";
echo $js;

RCDMap.js

var RCDMap = {

  markers: [], 
	numMarkers: 0,

	options: {
		zoom: 10, 
		center: null, 
		mapTypeId: google.maps.MapTypeId.HYBRID, 
		scrollwheel: false, 
		mapTypeControlOptions: {
			style: google.maps.MapTypeControlStyle.DROPDOWN_MENU	
		}, 
		scaleControl: false
	}, 

	map: null,
	mapNote: null,
	currentUrl: '',

	init: function(mapId, lat, lng) {
		if(lat != 0) RCDMap.options.center = new google.maps.LatLng(lat, lng); 
		RCDMap.map = new google.maps.Map(document.getElementById(mapId), RCDMap.options); 
		RCDMap.mapNote = $("<div id='map_note' class='map_note'></div>");	
		$("body").append(RCDMap.mapNote);
		RCDMap.mapNote.css({
			position: 'absolute', 
			left: 0, 
			top: '-100px'
		});
		RCDMap.mapNote.mouseout(function() {
			RCDMap.mapNote.hide();
		}).click(function() {
			if(RCDMap.currentUrl.length > 0) window.location.href = RCDMap.currentUrl; 
		}); 
	}, 

	addMarker: function(title, url, lat, lng, cat) {


		var latLng = new google.maps.LatLng(lat, lng); 
		/* The path to the icons folder */
		var path = '/site/templates/styles/images/';
		var marker = new google.maps.Marker({ 
			position: latLng, 
			map: RCDMap.map,
			icon: path + cat + '.png'

		});

		RCDMap.markers[RCDMap.numMarkers] = marker;
		RCDMap.numMarkers++;

		google.maps.event.addListener(marker, 'mouseover', function(e) { 
			RCDMap.currentUrl = url; 
			RCDMap.mapNote.html("<span>" + title + "</span>").show()
				.css('top', '0px')
				.css('left', '0px')
				.css('display', 'block')
				.css('width', 'auto')
				.css('color', '#ffffff')
				.css('background', '#000000')
				.css('padding', '2px 5px 2px 5px');

			$(document).mousemove(function(e) {
				$("#map_note").css({
					'top': e.pageY-10, 	
					'left': e.pageX+15
					});
			}); 

		});

		google.maps.event.addListener(marker, 'mouseout', function(e) {
			RCDMap.mapNote.hide();
			$(document).unbind("mousemove"); 
		}); 

		google.maps.event.addListener(marker, 'click', function(e) {
			window.location.href = RCDMap.currentUrl; 
		}); 
    /*Adds the markers to array*/
		RCDMap.markers.push(RCDMap.marker);


	},

	fitToMarkers: function() {
		var bounds = new google.maps.LatLngBounds();
		for(var i = 0; i < RCDMap.numMarkers; i++) {	
			var latLng = RCDMap.markers[i].position; 
			bounds.extend(latLng); 
		}
		RCDMap.map.fitBounds(bounds);
    /*Settings for clusters*/
		var mcOptions = {gridSize: 50, maxZoom: 15};
		var markerCluster = new MarkerClusterer(RCDMap.map, RCDMap.markers, mcOptions);

	}

}