[英]transition of polygon opacity in google maps v3
我需要查看颜色从零不透明度到1的过渡。这个想法是,您可以看到颜色的过渡,但看不到如何做,这是我的代码:
var geocoder;
var shape = [];
var map;
// Define the LatLng coordinates for the polygon's path.
var coordinates = [
[
new google.maps.LatLng(25.774252, -80.190262),
new google.maps.LatLng(18.466465, -66.118292),
new google.maps.LatLng(32.321384, -64.75737),
new google.maps.LatLng(25.774252, -80.190262)],
[
new google.maps.LatLng(32.990236, -89.296875),
new google.maps.LatLng(42.163403, -86.835938),
new google.maps.LatLng(42.163403, -76.113281)]
];
function initialize() {
map = new google.maps.Map(
document.getElementById("map_canvas"), {
center: new google.maps.LatLng(35.394070, -78.515056),
zoom: 4,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
}
function update(color) {
for (var i in coordinates) {
var options = ({
path: coordinates[i],
strokeColor: 'black',
strokeOpacity: 0.3,
strokeWeight: 1,
fillColor: color,
fillOpacity: 0.9,
zIndex: 1,
map: map
});
if ( !! shape[i] && !! shape[i].setMap) {
shape[i].setMap(null);
}
shape[i] = new google.maps.Polygon(options);
}
}
var i = 0
function reload() {
i = i + 1;
var color = "#FFFFFF";
if (i % 2 == 0) {
color = "#0000FF";
}
update(color);
}
google.maps.event.addDomListener(window, "load", initialize);
我有一个想法可以处理这段代码,但是如果可以的话就不行了,而且运行速度非常快。
var opa = 0;
while (opa <= 1) {
shape[i].setMap(null);
shape[i].fillOpacity = opa;
shape[i].setMap(map);
opa = opa + 0.1;
}
添加一个window.setTimeout();
在while循环内的代码周围。 例如
var opa=0;
while(opa<=1){
window.setTimeout(function() {
shape[i].setMap(null);
shape[i].fillOpacity=opa;
shape[i].setMap(map);
opa=opa+0.1;
}, 500);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.