如何限制 Google 我的地图 iFrame 中的控件答案

【问题标题】：How to limit controls in Google MyMaps iFrame如何限制 Google 我的地图 iFrame 中的控件
【发布时间】：2018-07-13 11:12:34
【问题描述】：

我正在尝试将 Google MyMaps iFrame 嵌入网站。为了让网站用户更简单，我想在 MyMap 中禁用自定义要素（多边形）的选择。

我尝试了不同的选项，在下面的 sn-p 中我尝试添加

&ctrl=false

进入源代码，这给出：

<iframe src="https://www.google.com/maps/d/embed?mid=1_oHvw6cNxTcQdsVcW7jw-BJh1hhRtM5l&ctrl=false" width="640" height="420" ></iframe>

但不起作用。

有没有办法让地图包含我的自定义多边形，而不允许选择该多边形？

【问题讨论】：

从您的 MyMap 中提取数据并将其显示在 Google Maps JavaScript API v3 地图上。

标签： html google-maps iframe mymaps

【解决方案1】：

用一个简单的例子来扩展这个：

是的，如果您想实现您描述的功能，您需要通过 JavaScript API 创建地图。

为了在地图上绘图，您需要在地图上定义形状的每个点的lat 和lng。

为了举例，我创建了一个简单的地图，它在怀俄明州和科罗拉多州绘制了一个正方形，将州封装在突出显示的区域中。

这里是代码方法。首先，您需要通过标记形状的坐标来定义边界。我通过创建变量COborder 和WYborder 来做到这一点。

 var COborder = [
      {lat: 41.00244, lng: -102.05165},
      {lat: 41.00056, lng: -109.05016},
      {lat: 36.99909, lng: -109.04521},
      {lat: 36.99295, lng: -102.04204},
    ]

    var WYborder = [
      {lat: 40.99752, lng: -111.04705},
      {lat: 41.00477, lng: -104.05151},
      {lat: 44.99831, lng: -104.057},
      {lat: 45.0017, lng: -111.05255}

定义形状后，您需要在地图上将它们显示为多边形。

 map.data.add( {geometry: new google.maps.Data.Polygon([COborder])})
 map.data.add( {geometry: new google.maps.Data.Polygon([WYborder])})

如果你想看一个活生生的例子，我设置了一个 JSFiddle here.

【讨论】：