I want to implement a feature in my app (gmap powered) to highlight the area on mouse over. Much like the functionality in wikimapia. Check out the pic or url

Highlight area on mouse hover

But i could't find any info on how to do this. I believe we need to have the shape info of every location to highlight the are, but i dont know how to do.

Can someone help me out?

1 Answer 1


You can load a kml file containing your polygons or create theme dynamically with the help of the Polygon class.

Here is an example of creating a polygon but the simplest way is loading a kml file. Just be sure your Kml file is under the file size limit (which can change at any time).

By default on the given example, I guess fill color is transparent, that's why it is invisible. And it get the highlight color by register events on mouse over.

You can then add listeners to your object on mouseover/mouseout like so :

google.maps.event.addListener(object,"mouseover",function() {
   // your code

Here comes an example on polylines but it can be done the same way on polygons.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.