Highlight on polygons

[GoogleCodeExporter]

Is it possible to create a hover effect on the polygons? I know you can make 
the marker appear, but can you actually change the color of the shape itself or 
add an outline?

Original issue reported on code.google.com by kat.do...@gmail.com on 19 Jul 2011 at 11:54

[GoogleCodeExporter]

It's pretty easy to do a hover effect where you add a second PolyGonzo overlay 
on top of the main one, with that second overlay containing only the feature(s) 
you want to highlight.

This does the trick if you want a heavier border on hover, for example. You 
could also darken and change a fill color this way, but you'd be mixing with 
whatever color is below it in the main overlay.

The Turkish election map has a hover border effect:

http://www.google.com.tr/intl/tr/landing/elections/2011/

The code to do that is in this file:

http://code.google.com/p/election-results/source/browse/turkey2011/gadget/turkey
-results-map.js

Search for PolyGonzo.PgOverlay and you'll find the two PolyGonzo overlays. The 
main one is set up in the draw() function. This is the usual PgOverlay that 
includes all the provinces or districts being displayed.

A few lines above that is the mousemove code that calls outlineFeature() when 
the mouse moves over a new feature or over no feature. outlineFeature() creates 
or removes a second PolyGonzo overlay for the one feature being highlighted.

This code uses only a border highlight, but you could try changing the 
fillColor and fillOpacity to mix a transparent fill over the original color.

Sometime I want to merge this hover code into polygonzo itself, but this should 
get you going in the meantime. Be sure to use the latest polygonzo.js since it 
has updates to support these hover effects.

Feel free to fire back with questions.

Thanks!

Original comment by m...@mg.to on 21 Jul 2011 at 9:22

• Changed state: Accepted

[GoogleCodeExporter]

Original comment by m...@mg.to on 21 Jul 2011 at 9:22

• Added labels: Type-Enhancement
• Removed labels: Type-Defect

[GoogleCodeExporter]

That works beautifully. Thank you!

Original comment by kat.do...@gmail.com on 21 Jul 2011 at 9:45