1

我正在使用 Google Maps V3 API 来显示我的地图。

问题：我怎样才能给地图着色，比如蓝色，这样地图图块有蓝色，但标记和其他叠加层没有？我不希望在地图本身上使用自定义样式，这会导致我快速达到样式地图的谷歌地图使用限制。

我想添加一个不透明的蓝色多边形，但认为当您平移地图时多边形会移出屏幕。有没有更好的方法来达到这个效果？

4

3 回答 3

1

添加一个矩形对我来说看起来很有说服力，但有一个缺陷：放大和缩小地图时会闪烁。我没有彻底测试，但您可能会遇到分层问题，例如，无法单击矩形下方的线。我记得，标记位于不同的窗格中，因此可以单击。

演示 http://jsfiddle.net/yV6xv/27/

bounds = new google.maps.LatLngBounds(
  new google.maps.LatLng(-84.999999, -179.999999), 
  new google.maps.LatLng(84.999999, 179.999999));

rect = new google.maps.Rectangle({
    bounds: bounds,
    fillColor: "#0000ff",
    fillOpacity: 0.3,
    strokeWeight: 0,
    map: map
});

旁注：我尝试了这样的 KML 叠加层：

  <ScreenOverlay>
    <name>Dynamic Positioning: Top of screen</name>
    <visibility>0</visibility>
    <Icon>
      <href>http://...blue.png</href>
    </Icon>
    <overlayXY x="0" y="1" xunits="fraction" yunits="fraction"/>
    <screenXY x="0" y="1" xunits="fraction" yunits="fraction"/>
    <rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/>
    <size x="1" y="1" xunits="fraction" yunits="fraction"/>
  </ScreenOverlay>

本来是赢家，但你不能拖动和滚动地图。

于 2012-06-09T21:16:29.077 回答
0

我将假设您的意思是将 API 嵌入到网页中。如果这是真的，你可以将 API 包装到一个 div 中，让我们说，然后使用一些 CSS 用你选择的蓝色填充 div，并将所述 div 的不透明度设置为 0.4 或（40%）。您的代码将如下所示：

HTML

<div id="mapwrapper">MAP API EMBEDDING CODE</div>

CSS

#mapwrapper{
      opacity:0.4;
      filter:alpha(opacity=40); /* For IE8 and earlier */
      }

由w3schools.com引用

我已将它用于网站上的社交媒体/社交网络连接。

同样，如果您要嵌入网站，我会特别询问您的意图，但是这该死的东西不会让我发表评论。

于 2012-06-09T21:21:41.180 回答
0

实际上，我自己发现了一个比建议的解决方案更有效的解决方案。

我的解决方案也将防止闪烁。在这个线程中检查它！

于 2013-07-16T14:14:04.737 回答