Desktop Components ShowcaseMobile Components Showcase
ace:gMapEvent - Overview

<ace:gMapEvent> allows for users to tap into Google's event handling capabilities and execute a chosen javascript on a variety of triggers. The variable 'map' can be used to affect the parent map and 'component' can be used to reference the parent component.

Component Script Event Trigger Purpose
Map: if (Math.abs(map.getCenter().lat())>30||
Math.abs(map.getCenter().lng())>20)
map.setCenter(new google.maps.LatLng(0,0));
End drag Resets the map to beginning location if dragged too far from start.
Marker: if(map.getZoom()<7){
map.setCenter(component.getPosition());
map.setZoom(18);
map.setMapTypeId(google.maps.MapTypeId.HYBRID);
}else{
map.setCenter(new google.maps.LatLng(0,0));
map.setZoom(4);
map.setMapTypeId(google.maps.MapTypeId.ROADMAP);
}
Click Zooms in and changes the map type initially. Click again to reset.
InfoWindow: alert('InfoWindow was closed. Please click on the marker to reopen.'); Close window Alerts with predefined message.
Circle: if (component.getRadius()>600000)
component.setOptions({fillColor:'red'});
else if(component.getRadius()<375000)
component.setOptions({fillColor:'blue'});
else
component.setOptions({fillColor:'green'});
Resizing Changes the circle's fill colour based upon the current radius.
Source Code