Google maps api 3 在Google Maps API中使用Kmlayer对象，是否允许用户调整png覆盖的透明度？_Google Maps Api 3_Kml

Google maps api 3 在Google Maps API中使用Kmlayer对象，是否允许用户调整png覆盖的透明度？

google-maps-api-3

Google maps api 3 在Google Maps API中使用Kmlayer对象，是否允许用户调整png覆盖的透明度？,google-maps-api-3,kml,Google Maps Api 3,Kml,使用Google Maps API中的Kmlayer对象，是否允许用户调整overlay.png功能的透明度（由某些.kml文件引用）？据我所知，通过标准Google API是不可能的，但您可以使用jquery或其他库来实现这一点。KML图像只是DOM的一部分，因此如果可以找到节点，就可以操纵它们的属性。下面是一个使用jquery的示例： <!DOCTYPE html> <html> <head> <meta nam

使用Google Maps API中的Kmlayer对象，是否允许用户调整overlay.png功能的透明度（由某些.kml文件引用）？

据我所知，通过标准Google API是不可能的，但您可以使用jquery或其他库来实现这一点。KML图像只是DOM的一部分，因此如果可以找到节点，就可以操纵它们的属性。下面是一个使用jquery的示例：

    <!DOCTYPE html> 
    <html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Google Maps JavaScript API v3 Example: KmlLayer KML</title> 
    <script src="http://code.jquery.com/jquery-1.4.4.js"></script>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
    <script type="text/javascript"> 
    $(document).ready(function(){
    $(".b_opacity").click(function(){
//this will find all the images in the map canvas container. Normally you would want to target specific images by the value of src
    $("#map_canvas").find("img").css("opacity","0.4")

    })
    })


    function initialize() {
      var chicago = new google.maps.LatLng(41.875696,-87.624207);
      var myOptions = {
        zoom: 11,
        center: chicago,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      }

      var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

      var ctaLayer = new google.maps.KmlLayer('http://code.google.com/apis/kml/documentation/KML_Samples.kml');
      ctaLayer.setMap(map);
    }
    </script> 
    </head> 
    <body onload="initialize()"> 

      <div id="map_canvas" style="width: 600px;height: 600px;"></div> 
      <input type="button" value="dim the lights" class="b_opacity">
    </body> 
    </html>


谷歌地图JavaScript API v3示例：KmlLayer KML
$（文档）.ready（函数（）{
$（“.b_不透明”）。单击（函数（）{
//这将在MapCanvas容器中找到所有图像。通常，您希望通过src的值来定位特定的图像
$（“地图画布”）.find（“img”）.css（“不透明度”，“0.4”）
})
})
函数初始化（）{
var chicago=new google.maps.LatLng（41.875696，-87.624207）；
变量myOptions={
缩放：11，
中心：芝加哥，
mapTypeId:google.maps.mapTypeId.ROADMAP
}
var map=new google.maps.map（document.getElementById（“map_canvas”），myOptions）；
var ctaLayer=new google.maps.KmlLayer（'http://code.google.com/apis/kml/documentation/KML_Samples.kml');
ctaLayer.setMap（map）；
}

注意：请记住css属性不透明度在IE中不起作用。您必须为IE使用filter:alpha（不透明度=40），或者您可以使用jQuery.fade（）方法。

此样式适用于我：

#map > div > div > div > div > div:nth-child(2) img[draggable="false"] {
  opacity: 0.4;
}

此控件对跨浏览器友好，可以使用上面的jQuery进行调整：