The POLYGON_CLICK event is fired when you click on the polygon.
<div id="map_canvas"></div>
var GORYOKAKU_POINTS = [
{lat: 41.79883, lng: 140.75675},
{lat: 41.799240000000005, lng: 140.75875000000002},
{lat: 41.797650000000004, lng: 140.75905},
{lat: 41.79637, lng: 140.76018000000002},
{lat: 41.79567, lng: 140.75845},
{lat: 41.794470000000004, lng: 140.75714000000002},
{lat: 41.795010000000005, lng: 140.75611},
{lat: 41.79477000000001, lng: 140.75484},
{lat: 41.79576, lng: 140.75475},
{lat: 41.796150000000004, lng: 140.75364000000002},
{lat: 41.79744, lng: 140.75454000000002},
{lat: 41.79909000000001, lng: 140.75465},
{lat: 41.79883, lng: 140.75673}
];
var mapDiv = document.getElementById("map_canvas");
var map = plugin.google.maps.Map.getMap(mapDiv, {
camera: {
target: GORYOKAKU_POINTS
}
});
map.addEventListener(plugin.google.maps.event.MAP_READY, function() {
// Show a virtual dialog (loader.js)
showVirtualDialog(mapDiv, "Click on the polygon!");
// Add a polygon
map.addPolygon({
'points': GORYOKAKU_POINTS,
'strokeColor' : '#AA00FF',
'strokeWidth': 5,
'fillColor' : '#880000',
'clickable' : true // default = false
}, function(polygon) {
// Catch the POLYGON_CLICK event
polygon.on(plugin.google.maps.event.POLYGON_CLICK, onPolygonClick);
});
});
// The POLYGON_CLICK event passes to the callback
// with the latLng position which is you clicked.
function onPolygonClick(clickLatLng) {
// The callback is called as the overlay instance.
var polygon = this;
// You can change the style for instance.
polygon.setFillColor("blue");
polygon.setStrokeColor("green");
polygon.setStrokeWidth(10);
// If you want to get the map instance,
// use the polygon.getMap() method.
// The polygon.getMap() method returns the map instance
// which is bound to the polygon.
var map = polygon.getMap();
map.addMarker({
position: clickLatLng,
title: "You clicked here on the polygon!",
snippet: clickLatLng.toUrlValue()
}, function(marker) {
marker.showInfoWindow();
});
}