Question

我正在尝试使用maps.google.com上的嵌入功能将简单的Google地图添加到我的网站。

以下是为我生成的代码：

<iframe src="https://www.google.com/maps/embed?pb=!1m12!1m8!1m3!1d2391.716465442018!2d-0.6309220000000001!3d53.169126500000004!3m2!1i1024!2i768!4f13.1!2m1!1sAqua+House%2C+Lincoln+Enterprise+Park%2C+Newark+Road%2C+Lincoln%2C+LN5+9FP!5e0!3m2!1sen!2suk!4v1418907912180" width="100%" height="410" frameborder="0" style="border:0"></iframe>

我无法找到的是如何禁用用户控件，这样如果他们不小心在地图上向下滚动，它就不会放大负载。

Answer 1

我不认为你对iframe有很多控制权。最好的选择是使用Google Maps JavaScript API v3并设置disableDefaultUI: true

Answer 2

尝试在get-parameters中添加选项signed_in=false 如果使用js-api：

，它可以工作

<script>
    // Google map
    function initMap() {

      var map = new google.maps.Map(document.getElementById('map2'), {
        zoom: 17,
        center: {lat: <lat>, lng: <lng>},
        scrollwheel: false,
          disableDefaultUI: true,
      });
      var image = 'images/map-icon.png';
      var marker = new google.maps.Marker({
        position: {lat: <lat>, lng: <lng>},
        map: map,
        icon: image,
        title: 'Hello World!'
      });
    }
</script>
<script async defer
     src="https://maps.googleapis.com/maps/api/js?signed_in=false&callback=initMap">
</script>

Answer 3

也许我这样做太可怕了，但我想要嵌入的简单性，但也没有控件：

将iframe设为两倍大并隐藏溢出，问题解决了。

如果有人能看到这个问题，我很好奇......

＆＃13;

div.map-container {
  position: relative;
  overflow: hidden;
  min-height: 500px;
  width: 100%;
}
iframe.map {
  width: 200%;
  height: 150%;
  position: absolute;
  bottom: -25%;
  left: -50%;
}

＆＃13;

<div class="map-container">
  <iframe class="map" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2689.289359274373!2d-122.35146608361184!3d47.62050627918564!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x5490151f4ed5b7f9%3A0xdb2ba8689ed0920d!2sSpace+Needle!5e0!3m2!1sen!2sus!4v1478295713465" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>

＆＃13;

编辑：稍微误读了OP。您可以在地图顶部覆盖div，并且该位置的任何交互都将与div交互，而不是地图本身。

Haven没玩过它，但你也可以给iframe一个：

pointer-events: none;

可能无法在每个浏览器中使用;但这是一条你可以探索的道路。

Google地图嵌入了禁用用户控件

3 个答案: