Blocks of JavaScript code below show how the Geocoding magic is called:
<html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/> <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> <title>Google Maps JavaScript API v3 Example: Geocoding Simple</title> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> var geocoder; var map; function initialize() { geocoder = new google.maps.Geocoder(); var latlng = new google.maps.LatLng(-34.397, 150.644); var myOptions = { zoom: 15, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); } function setGoogleMapDomain(myDiv, domain) { var frames = myDiv.getElementsByTagName('iframe'); if (frames.length > 0) { window.frames[frames[0].id].document.domain = domain; } } function codeAddress() { var xxx; if (document.URL.indexOf('?') == -1) xxx = "kuala lumpur, malaysia"; else xxx = document.URL.substring(document.URL.indexOf('?') + 9, document.URL.length); xxx = xxx.replace(/%20/gi, ' '); // alert(xxx); var address = xxx; var image = 'new.gif'; if (geocoder) { geocoder.geocode({ 'address': address }, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { map.setCenter(results[0].geometry.location); var marker = new google.maps.Marker({ map: map, position: results[0].geometry.location, icon: image }); } else { alert("Geocode was not successful for the following reason: " + status); } }); } } </script> </head> <body style="margin:0px; padding:0px;" onload="initialize(); codeAddress();"> <div id="map_canvas" style="width:600px; height:400px;"></div> </body> </html>
After that, just right click your .aspx file and view in browser.
Implement into CRM
- Create a IFrame in CRM page.
- Set the appropriate properties.
You should see Google Maps in CRM like this:
For more information in using Google Maps API, click this.
No comments:
Post a Comment