引导程序 3 和谷歌地图 2

【问题标题】：Bootstrap 3 and google maps 2引导程序 3 和谷歌地图 2
【发布时间】：2013-12-22 13:14:16
【问题描述】：

我在使用 Bootstrap 3 和 gmaps 2 时遇到问题。问题是我的地图控件未正确显示，如下图所示。

下面也是我的代码：

<script type="text/javascript">

function initialize(){
  if (GBrowserIsCompatible())
  {
    map=new GMap2(document.getElementById("map_canvas"));
    map.setCenter(new GLatLng(37.084142,25.151997), 11);
    map.setUIToDefault();


  }

  }
  </script>
 </head>  
 <body onload="initialize()" onunload="GUnload()">

有什么想法吗..？

【问题讨论】：

Blurry / Corrupted Google Maps Controls 的可能重复项
Google Maps API v2 已弃用（并已关闭），不应将其用于新开发。

标签： css google-maps twitter-bootstrap-3 google-maps-api-2

【解决方案1】：

我也曾经遇到过这个问题，这是冲突 发生在你的CSS 和gmaps。你可能有一个像全局 CSS 一样的

img {
  max-width:100% // or something
}

通过检查（使用浏览器的开发工具），您可以找到它被覆盖的位置并尝试使用id 或class 选择器并将其更改为none。

我已经测试过了here

#map_canvas img {
  max-width: none;
}

【讨论】：

我没有在任何地方实现这段代码。你确定是这个问题吗？？
@John 这很常见，可能是 bootstrap.min.css 或任何其他。然而，这可以通过在答案中添加 css 来轻松解决。通过检查您的页面，您可以轻松找到它被覆盖的位置
它可能在引导 css 代码中...非常感谢您的回复。With #map_canvas img { max-width: none; } 成功了！！！
@John 我很高兴能帮上忙 :)