Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is there a way to fade out a V3 google.maps.Polygon?

Is there a way to fade out a V3 google.maps.Polygon?

Instead of just hiding / removing a standard Google Maps V3 polygon I want to fade it out.

Is this possible? Are there any plugins out there?

like image 410
iambriansreed Avatar asked Mar 02 '12 22:03

iambriansreed


1 Answers

The following is a solution I created to address the uniform fade out of stroke and fill and I made it easily reusable by making it a function.

seconds is how long it will take the fade out to occur and callback so you could do perform another action once it completes.

In my project my callback function removes the polygon from the map and deletes the variable.

function polygon_fadeout(polygon, seconds, callback){
    var
    fill = (polygon.fillOpacity*50)/(seconds*999),
    stroke = (polygon.strokeOpacity*50)/(seconds*999),
    fadeout = setInterval(function(){
        if(polygon.strokeOpacity + polygon.fillOpacity <= 0.0){
            clearInterval(fadeout);
            polygon.setVisible(false);
            if(typeof(callback) == 'function')
                callback();
            return;
        }
        polygon.setOptions({
            'fillOpacity': Math.max(0, polygon.fillOpacity-fill),
            'strokeOpacity': Math.max(0, polygon.strokeOpacity-stroke)
        });
    }, 50);
}
like image 93
iambriansreed Avatar answered Sep 28 '22 03:09

iambriansreed