Question

我使用GoogleMaps并希望在方向发生变化时将其居中，但是当我打电话时

map.setCenter({...})

我收到了setCenter的未定义错误。

这是我的代码：

let GoogleMap = {
  lat : "",
  lng : "",
  map : {},
  marker : {},
  point : {},

  init() {
    return this
  },

  create(lat, lng) {
    this.lat = lat
    this.lng = lng
    this.point = {lat: lat,lng: lng};

    this.map = new google.maps.Map(document.getElementById('map'), {
      center: this.point,
      zoom: 17
    });

    this.marker = new google.maps.Marker({
      map: this.map,
      position: this.point
    });

    window.addEventListener('orientationchange', this.doOnOrientationChange);
  },

  doOnOrientationChange() {
    this.map.setCenter({lat: this.lat, lng: this.lng})
  }
}

export default GoogleMap

文档：https://developers.google.com/maps/documentation/javascript/reference#Map

我抓住了来自https://maps.googleapis.com/maps/api/js?key=KEY&libraries=geometry,places

的谷歌地图api

有什么想法吗？

Answer 1

感谢geocodezip，问题是范围界定，这在方向事件处理程序中的范围不正确。

修复是使用绑定方法

window.addEventListener('orientationchange', this.orientationChange.bind(this));

完整的工作代码：

let GoogleMap = {
  lat : "",
  lng : "",
  map : {},
  marker : {},
  point : {},

  init() {
    return this
  },

  create(lat, lng) {
    this.lat = lat
    this.lng = lng
    this.point = {lat: lat,lng: lng};

    this.map = new google.maps.Map(document.getElementById('map'), {
      center: this.point,
      zoom: 17
    });

    this.marker = new google.maps.Marker({
      map: this.map,
      position: this.point
    });

    window.addEventListener('orientationchange', this.orientationChange.bind(this));
  },

  orientationChange() {
    this.map.setCenter({lat: this.lat, lng: this.lng})
  }
}

export default GoogleMap

当方向发生变化时，地图现在按预期居中。

map.setCenter未定义

1 个答案: