如果我使用的是 vue2-google-maps 包，有没有办法在谷歌地图 API 上禁用可点击的地标？

Question

我正在尝试删除谷歌地图API上的可点击地标，我找到了如果要这样做，我必须将其设置为false的属性，但是，由于我正在使用 https://www.npmjs.com/package/vue2-google-maps，我似乎无法弄清楚如何做到这一点，并且vue2-google-maps文档似乎没有指示如何更改此属性。

基于这个 https://developers.google.com/maps/documentation/javascript/reference/map#MapOptions.clickableIcons，我需要将clickableIcons设置为 false。可悲的是，我不知道如何访问该属性clickableIcons.

到目前为止，我已经以这种方式访问了其他几个属性，例如缩放和居中：

        <GmapMap ref="mapRef"
            @click='createMarker'
            :center="center"
            :zoom="zoom"
            :map-type-id="map"
            style="width: 100%; height: 800px"
        >
        </GmapMap>

但是，在这种情况下，添加 ：clickableIcons： false 似乎没有任何作用。

Answer 1

您可以考虑使用以下选项将地图图标设置为不可单击。

选项 1

vue-google-maps google.maps.MapOptions.clickableIcons属性可以这样设置：

<GmapMap :center="center" :zoom="zoom" :options="options"></GmapMap>

export default {
  data() {
    return {
      zoom: 12,
      center: { lat: 51.5287718, lng: -0.2416804 },
      options: {
        clickableIcons: false
      }
    };
  }
}

选项 2

通过ref访问google.maps.Map.setClickableIcons方法：

<GmapMap :center="center" :zoom="zoom" ref="mapRef"></GmapMap>

export default {
  data() {
    return {
      zoom: 12,
      center: { lat: 51.5287718, lng: -0.2416804 },
    };
  },
  mounted: function() {
     this.$refs.mapRef.$mapPromise.then(() => {
        this.$refs.mapRef.$mapObject.setClickableIcons(false)
    })
  }
}