Skip to content

Instantly share code, notes, and snippets.

@calvinnr7

calvinnr7/Google Map Demo

Created May 12, 2015 05:33
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save calvinnr7/1ab3c60bce9697632e10 to your computer and use it in GitHub Desktop.
Save calvinnr7/1ab3c60bce9697632e10 to your computer and use it in GitHub Desktop.
Download ZIP
SFDC Code
Raw
Google Map Demo
<!-- Author: Calvin Noronha-->
<!-- Date:May 1 2015-->
<apex:page standardController="Contact">
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"></meta>
<meta charset="utf-8"></meta>
<title>Simple markers</title>
<style>
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
<script>
//JS function to initialize Google Map
function initialize() {
var geocoder= new google.maps.Geocoder();
var address = "{!Contact.MailingStreet}, " + "{!Contact.MailingCity}, " + "{!Contact.MailingPostalCode}, " + "{!Contact.MailingCountry}";
geocoder.geocode( { 'address': address}, function(results, status){
if (status == google.maps.GeocoderStatus.OK) {
var myLatlng = results[0].geometry.location;
//alert(results[0].geometry.location)
var mapOptions = {
zoom: 8,
center: myLatlng
}
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: '{!Contact.MailingStreet}'
});
}
else {
alert("The google maps geocoding operation failed due to: " + status);
}
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas" style="width: 1000px; height: 1000px"></div>
</body>
</html>
</apex:page>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment