谷歌地图可以有透明的bg吗？

Question

google地图可以有透明的bg吗？我一直搞乱参数，但无法找到解决方案。我正在使用JS API。

感谢。

Answer 1

有一种方法可以使用Google Maps API V3为地图提供透明背景。 MapOptions对象有一个名为backgroundColor的属性，用于设置地图的背景颜色。如果使用HSLA颜色值，则可以控制此背景颜色的不透明度以创建透明度。

var mapOptions = {
zoom: 1,
styles: mapStyles,
backgroundColor: 'hsla(0, 0%, 0%, 0)',
};

除了设置此颜色外，您还需要使用一些地图样式来隐藏水（或任何您想要透明的水）。

这是一个展示效果的codepen： http://codepen.io/verticalgrain/pen/LVRezx

Answer 2

这似乎可以通过将opacity与CSS设置为小于1的值来实现。所有现代浏览器都支持opacity本机或使用专有指令。

<!-- The container to which the map is rendered by the Google JS library -->
<div id="mapContainer" style="opacity:0.5"></div>