Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
87 lines (75 sloc) 3.71 KB
<apex:page showHeader="false">
<html>
<head>
<!--
This stylesheet contains specific styles for displaying the map on this page. Replace it with your own styles as described in the documentation:
https://developers.google.com/maps/documentation/javascript/tutorial
-->
<link rel="stylesheet" href="//developers.google.com/maps/documentation/javascript/demos/demos.css"/>
</head>
<body>
<div id="map"></div>
<script>
var lexOrigin = 'https://{!$CurrentPage.parameters.lcHost}';
//Data for Google map
var data;
//Send message to LC
function sendToLC(message) {
if(typeof(lexOrigin) != 'undefined'){
parent.postMessage(message, lexOrigin);
}
}
//Receive message from LC
window.addEventListener("message", function(event) {
//If page is public (like used in force.com sites) then be careful about the origin
//if (event.origin !== lexOrigin) {
// Not the expected origin: reject message!
//return;
//}
// Handle message
console.log('Data Sent to VF: ', event.data);
data = event.data;
if(typeof(event.data.loadGoogleMap) != 'undefined'){
//Load Google Map Script
var script = document.createElement("script");
script.src = "https://maps.googleapis.com/maps/api/js?key=AIzaSyDLrw96AqCjIRMipWgIm-3pqoRSwQrHtCs&callback=initMap";
document.getElementsByTagName("head")[0].appendChild(script);
}
}, false);
//Callback when Google Map is loaded
function initMap() {
//Add marker for each point along with text
function addMarker(feature) {
var marker = new google.maps.Marker({
position: feature.position,
//icon: icons[feature.type].icon,
map: map
});
var infoWindow = new google.maps.InfoWindow({
content: feature.markerText
});
marker.addListener('click', function() {
infoWindow.open(map, marker);
});
}
//Create new map
var map = new google.maps.Map(document.getElementById("map"), JSON.parse(data.mapOptions));
//Set map center
map.setCenter(data.mapOptionsCenter);
//iterate through map data for each point (even if 1)
var mapData = data.mapData;
for(var i=0, j=mapData.length; i<j; i++){
//Add marker for each point
var myLatlng = new google.maps.LatLng(mapData[i].lat, mapData[i].lng);
addMarker({position: myLatlng, markerText: mapData[i].markerText });
}
}
//Let LC know that VF page been loaded along with it's URL
//LC will then send the data
//This is done because LC has no way to know that VF page in iFrame has been loaded, event listener set and ready for data
var vfHost = "{!LEFT($CurrentPage.URL,FIND('/',$CurrentPage.URL,9))}";
sendToLC({'state':'LOADED', 'vfHost': vfHost});
</script>
</body>
</html>
</apex:page>