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 some one help me out.



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.

  • thanks for the kml. so now another question where would i get the kml info about the particular region... wikimapia almost got all the areas covered with the highlighting.. where would i get that... – RameshVel Sep 15 '11 at 12:45
  • You can convert a shapefile (or any other format) to kml with ogr for example. You can also create your polygons yourself on googlemaps and export it as kml. – simo Sep 15 '11 at 12:55
  • 1
    @simo: could you comment on what would be the size limitation of KML files used in this way? – radek Sep 15 '11 at 13:49
  • @simo, sorry to bother.. My application is global targetted, so i can't create the polygon/shapefile for all the areas, is there a open framework/wiki where i can download the shapefiles for a country/region.. or any idea about wikimapia shapefiles? – RameshVel Sep 15 '11 at 13:52
  • radek : +1 I added a reference/link into my post – simo Sep 15 '11 at 13:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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