谷歌地图:透明多边形

Sta*_*hil 1 javascript google-maps colors polygons

我有一张包含一组彩色多边形的地图。有时我想将每个多边形的填充颜色从任何颜色更改为透明。我有以下代码:

polys[x].setOptions({
    fillColor: "#FFFFFF",
    fillOpacity: .01,  //This changes throughout the program      
    strokeColor: '#000000',
});
Run Code Online (Sandbox Code Playgroud)

如何将fillColor设置为透明?是否有特定的十六进制值?

geo*_*zip 6

所述google.maps.PolygonOptions.fillColor就是这样,颜色,没有“透明的”颜色,即不透明度值(0.0是完全透明的,如果1.0完全不透明)。

fillColor   | string | The fill color. All CSS3 colors are supported except for extended named colors.
fillOpacity | number | The fill opacity between 0.0 and 1.0
Run Code Online (Sandbox Code Playgroud)

更新:0.0 现在似乎适用于透明多边形(jsfiddle

fillColor   | string | The fill color. All CSS3 colors are supported except for extended named colors.
fillOpacity | number | The fill opacity between 0.0 and 1.0
Run Code Online (Sandbox Code Playgroud)
if (window.attachEvent) {
  window.attachEvent('onload', initMap);
} else if (window.addEventListener) {
  window.addEventListener('load', initMap, false);
} else {
  document.addEventListener('load', initMap, false);
}

function initMap() {
  var latlng = new google.maps.LatLng(51.5001524, -0.1262362);
  var myOptions = {
    zoom: 10,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  var map = new google.maps.Map(document.getElementById('map_canvas'), myOptions);
  var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    title: 'Westminster, London, UK'
  });
  var boundCoords = [
    new google.maps.LatLng(51.3493528, -0.378358),
    new google.maps.LatLng(51.7040647, 0.1502295),
    new google.maps.LatLng(51.5001524, -0.1262362)
  ];
  var boundCoords2 = [
    new google.maps.LatLng(51.3493528, -0.378358),
    new google.maps.LatLng(51.7040647, 0.1502295),
    new google.maps.LatLng(51.6001524, -0.1262362)
  ];
  var poly = new google.maps.Polygon({
    paths: boundCoords,
    strokeColor: '#FF0000',
    strokeOpacity: 0.8,
    strokeWeight: 3,
    fillColor: '#FF0000',
    fillOpacity: 0.35
  });
  poly.setMap(map);
  console.log(poly);
  var poly2 = new google.maps.Polygon({
    paths: boundCoords2,
    strokeColor: '#000000',
    strokeOpacity: 0.8,
    strokeWeight: 3,
    fillColor: '#FF0000',
    fillOpacity: 0.0
  });
  poly2.setMap(map);
  console.log(poly);

}
Run Code Online (Sandbox Code Playgroud)
html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
}
Run Code Online (Sandbox Code Playgroud)