如何更改总览图（Google Maps v3）中矩形的颜色？

我尝试在Google地图总览地图（位于Google地图窗口的右下角区域）中更改蓝色矩形的颜色。不幸的是，在Google地图v3的文档中没有任何关于此的说法。你有想法吗？如何更改总览图（Google Maps v3）中矩形的颜色？

2012-03-26 Peter H.

overvieMap是启用时地图内的小地图（位于右下角）。 – 2012-03-27 00:34:29

Thanks @ Dr.Molle - 如果您已在Google地图窗口的右下角区域中激活了总览地图，则会看到当前有大矩形的大地图。这是我想要着色的矩形 - 默认为蓝色... – 2012-03-27 00:46:00

没有办法通过API着色任何东西。

你可以做什么：使用JS找到元素，然后使用CSS来应用颜色。

例子：

google.maps.event.addListenerOnce(map,'tilesloaded',function() 
     { 
      try{ 
      var x=document.querySelector('img[src=\'http://maps.gstatic.com/mapfiles/mapcontrols3d7.png\']'); 
      if(x) 
      { 
       x.parentNode.parentNode.previousSibling.className="overviewMap"; 
       var y=document.querySelectorAll('.overviewMap>div>div>div>div>div>div'); 
       y[1].className="overviewMapRectangle"; 
      } 
      }catch(e){} 
     } 
     );

，这似乎是唯一有这样的图像（http://maps.gstatic.com/mapfiles/mapcontrols3d7.png）的唯一的事情，它是用来打开箭头/关闭overviewMap。该脚本搜索该图像并穿过DOM来查找该矩形。它将向可以用作选择器的矩形（overviewMapRectangle）添加一个类。

采样CSS：

.overviewMapRectangle + div > div{border:none !important} 
.overviewMapRectangle div{border-color: inherit !important} 
/*border-color of the rectangle*/ 
.overviewMapRectangle{border-color: yellow !important}  
/*background-color of the rectangle*/ 
.overviewMapRectangle>div>div{background: red !important}

演示：http://jsfiddle.net/doktormolle/ULmW5/

的问题：谷歌可能会改变明天的地图的DOM，它不会工作了。

来源

2012-03-27 02:20:11

非常感谢您的易于理解的解释！这帮了我很多...... – 2012-03-27 03:03:19

如何更改总览图（Google Maps v3）中矩形的颜色？

回答

相关问题