Utilizing code found here on the forum, I have tried to build out a map that marks multiple locations of our custom object. However, the visualforce page is rendering blank. Is there some glaring error in the code? I'm pretty new to the coding side and not sure what's missing

<!-- @Author:Mohammad Usman @Description:visual force page with multiple diffrent colour marker --> <apex:page Controller="locationlist" sidebar="false"> <script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false"></script> <style> #map { font-family: Arial; font-size:12px; line-height:normal !important; height:400px; padding: 20px; } .roundCornerCss{ /* outer shadows (note the rgba is red, green, blue, alpha) */ -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 1px 6px rgba(23, 69, 88, .5); /* rounded corners */ -webkit-border-radius: 12px; -moz-border-radius: 7px; border-radius: 7px; /* gradients */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(15%, white), color-stop(100%, #D7E9F5)); background: -moz-linear-gradient(top, white 0%, white 55%, #D5E4F3 130%); } </style> <script type="text/javascript"> var geocoder; var map; var infowindow = new google.maps.InfoWindow(); var places = []; var title_content = new Array(); var popup_content = new Array(); var address = new Array(); var address_position = 0; var timeout = 600; function initialize(){ geocoder = new google.maps.Geocoder(); var latlng = new google.maps.LatLng(29.01, 77.38); var myOptions = { zoom: 2, center: latlng, mapTypeId: 'roadmap' } <apex:repeat value="{!objlocation}" var="loc" id="addressesId"> title_content.push("Name: "+"{!loc.Name}"+" \nClick for more Detail"); address.push("{!loc.Location_Address__c}, {!loc.Location_City__c}, +"{!loc.Location_Zip_Code__c}"); popup_content.push("<b>Location Name: {!loc.Name} +"<br/>Street: {!loc.Location_Address__c}" +"<br/>City: {!loc.Location_City__c}<br/>Postal Code: {!loc.Location_Zip_Code__c}"); </apex:repeat> map = new google.maps.Map(document.getElementById("map"), myOptions); addMarker(address_position); } function addMarker(position){ geocoder.geocode({'address': address[position]}, function(results, status){ if (status == google.maps.GeocoderStatus.OK) { places[position] = results[0].geometry.location; var marker = new google.maps.Marker({ position: places[position], title:title_content[position], icon: getMapIconUrl(position+1), map: map }); google.maps.event.addListener(marker, 'click', function() { if (!infowindow) { infowindow = new google.maps.InfoWindow(); } infowindow.setContent(popup_content[position]); infowindow.open(map, marker); }); } else{ if (status == google.maps.GeocoderStatus.OVER_QUERY_LIMIT){ setTimeout(function() { addMarker(position); }, (timeout * 3)); } } address_position++; if (address_position < address.length){ setTimeout(function() { addMarker(address_position); }, (timeout)); } }); } </script> <apex:pageMessages /> <div id="map" class="roundCornerCss"></div> <script> initialize(); </script> </apex:page>