We noticed yesterday our Visualforce Page that shows a Google Map of an address stopped working across 2 Sandboxes and 1 Production instance.
We haven't modified any of the code, and can't find any indication that either Salesforce or Google Maps have updated their API requirements in the last week.
Is anyone having this issue?
The code for the Visualforce page is;
<apex:page standardController="AU_Enquiry__c">
<head>
<script type="text/javascript" src="https://maps.google.com/maps/api/js?key=OURKEY&sensor=false"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js?key=OURKEY"></script>
<script type="text/javascript">
$(document).ready(function() {
var myOptions = {
zoom: 13,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: true
}
var map;
var marker;
var geocoder = new google.maps.Geocoder();
var DisplayMap = "{!AU_Enquiry__c.Display_Map_Of__c}";
var shipAddress = "{!AU_Enquiry__c.Full_Shipping_Address__c}";
if (DisplayMap == "Address") {
var address = "{!AU_Enquiry__c.Full_Address__c}";
} else {
var address = "{!AU_Enquiry__c.Full_Shipping_Address__c}";
}
var infowindow = new google.maps.InfoWindow({
content: "<b>{!AU_Enquiry__c.First_Name__c} {!AU_Enquiry__c.Last_Name__c}</b><br>" + address + "<br>{!AU_Enquiry__c.Mobile_Phone__c}<br>"
});
geocoder.geocode( { address: address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK && results.length) {
if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
//create map
map = new google.maps.Map(document.getElementById("map"), myOptions);
//center map
map.setCenter(results[0].geometry.location);
//create marker
marker = new google.maps.Marker({
position: results[0].geometry.location,
map: map,
title: "{!AU_Enquiry__c.First_Name__c}"
});
//add listeners
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
google.maps.event.addListener(infowindow, 'closeclick', function() {
map.setCenter(marker.getPosition());
});
//Open Google maps
google.maps.event.addListener(map,'click',function() {
var centerLoc = results[0].geometry.location;
console.log('centerLoc==>>'+centerLoc);
console.log('centerLoc2==>>'+centerLoc);
var completeUrl = 'http://maps.google.com/maps?z=13&t=m&q=loc:'+centerLoc;
console.log('completeUrl==>>'+completeUrl);
window.open(completeUrl);
});
}
} else {
$('#.map').css({'height' : '15px'});
$('#.map').html("Oops! address could not be found, please make sure the address is correct.");
resizeIframe();
}
});
function resizeIframe() {
var me = window.name;
if (me) {
var iframes = parent.document.getElementsByName(me);
if (iframes && iframes.length == 1) {
height = document.body.offsetHeight;
iframes[0].style.height = height + "px";
}
}
}
});
</script>
<style>
#.map {
font-family: Arial;
font-size:12px;
line-height:normal !important;
min-height:200px;
//min-width:300px;
background:transparent;
}
</style>
</head>
<body>
<div id="map"></div>
</body>
</apex:page>
Hi Matt,
I'm not sure whether that's the reason, but I noticed none of your variables are javascript-encoded. This means any special characters, like a line break or quotes in the address, would break the code. If you encapsulate all your variable assignments with JSENCODE(), does that happen to fix it?
For instance:
var shipAddress = "{!JSENCODE(AU_Enquiry__c.Full_Shipping_Address__c)}";