Search code examples
google-maps-api-3clickablepolyline

google map v3 -make a polyline clickable and fix fragmenting


I am trying to create polyline outlines and fills for each state. I need the state polyline to be clickable. Also, when viewed at greater zoom levels the fill looks fragmented. Any suggestions?

see code below:

function drawBorder(){
 var Polyline_Path = new google.maps.Polyline({
path: newyork,
strokeColor: "#CD0000",
// color of the outline of the polyline
strokeOpacity: 1,
// between 0.0 and 1.0
strokeWeight: 1,
// The stroke width in pixels
fillColor: "#CD0000",
fillOpacity: 1,
clickable: true
});
Polyline_Path.setMap(map);

google.maps.event.addListener(Polyline_Path, 'click', function() {   
alert('you clicked polyline');    
}); 
}

this code does work to make the polyline clickable but only in a very specific area of the polyline. Is there a way to configure it to detect a click event anywhere in the state


Solution

  • I used the google.maps.Polygon instead and it took care of fragmenting and clickable issues