google-maps-api-3 - 设置 KML 图层透明度

Question

有没有办法在添加时设置kml图层的透明度？我正在添加一个你看不到下面街道的 kml 层。有没有办法做到这一点

 var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

  var ctaLayer = new google.maps.KmlLayer({
    url: 'images/test3.kml'
  });

  var ctaLayer2 = new google.maps.KmlLayer({
    url: 'images/test.kml'
  });
  var ctaLayer3 = new google.maps.KmlLayer({
    url: 'images/kmztest2.kmz'
  });
  ctaLayer3.setMap(map);
  ctaLayer2.setMap(map);
  ctaLayer.setMap(map);
}

google.maps.event.addDomListener(window, 'load', initialize);

Answer 1

由于 Google Maps API 将 KML 添加为 DOM 中的图像，您可以通过搜索 <img> 使用 CSS 更改其不透明度。包含 "kml" 的元素在其 src属性:

#map img[src*='kml'] {
    opacity: .5;
}

此外，您可以使用 jQuery 实现此目的:

jQuery("#map").find("img[src*='kml']").css("opacity","0.5");

但请记住，当用户缩小或移动 map 时，将加载新的 KML 图像，因此您必须再次调用该 jQuery 函数。