Có cách nào để làm mờ một V3 google.maps.Polygon không?

Question

Có cách nào để làm mờ một V3 google.maps.Polygon không?

Thay vì chỉ ẩn/xóa đa giác chuẩn của Google Maps V3, tôi muốn làm mờ nó ra.

Điều này có khả thi không? Có bất kỳ plugin nào không?

Answer 1

Sau đây là giải pháp mà tôi tạo ra để giải quyết đồng phục mờ nhạt và tô màu và dễ dàng sử dụng lại bằng cách đặt chức năng.

giây là thời gian sẽ mất dần dần để xảy ra và gọi lại để bạn có thể thực hiện một tác vụ khác sau khi hoàn thành.

Trong dự án của tôi chức năng gọi lại của tôi sẽ xóa đa giác khỏi bản đồ và xóa biến đó.

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); 
} 

Answer 2

Sử dụng Javascript setInterval()/clearInterval() để thay đổi độ mờ của đa giác tăng dần. Một cái gì đó như thế này:

var opacity = [1, 0.8] 
var polygon = new google.maps.Polygon({ 
     strokeColor: "#000099", 
     strokeOpacity: opacity[0], 
     strokeWeight: 2, 
     fillColor: "#0000FF", 
     fillOpacity: opacity[1], 
     paths: [ /* your points here */ ] 
}); 

var interval = setInterval(function() { 
    if (opacity[0] <= 0.0 && opacity[1] <= 0.0) { 
    clearInterval(interval); 
    polygon.setVisible(false); 
    } else { 
    opacity[0] = Math.max(0.0, opacity[0] - 0.1); 
    opacity[1] = Math.max(0.0, opacity[1] - 0.1); 
    polygon.setOptions({strokeOpacity: opacity[0], fillOpacity: opacity[1]});  
    } 
}, 50);