Ionic 2 - Google Maps Native：标记点击事件未触发

Posted 2023-03-27

【中文标题】Ionic 2 - Google Maps Native：标记点击事件未触发

【英文标题】：Ionic 2 - Google Maps Native: marker click event not firing

【发布时间】：2018-04-29 03:12:36

【问题描述】：

我正在使用 Ionic 2 和 google maps cordova plugin。

“cordova-plugin-googlemaps”：“^2.0.11”

我无法触发此侦听器。

标记已添加到地图中，但点击事件不会触发警报。

感谢您的帮助！

    let latlng = new LatLng(spot.lat, spot.long);
    let markerOptions: MarkerOptions = 
        'position': latlng,
        'animation': 'drop'
      ;


      this.map.addMarker(markerOptions).then((marker: Marker) => 
        marker.addEventListener(GoogleMapsEvent.MARKER_CLICK).subscribe(e => 
          alert('foo');
        );
      );

附加信息

@ionic-native/core: 'version': 3.7.0

@ionic-native/google-maps: 'version': '4.3.0'

import GoogleMaps, GoogleMap, GoogleMapsEvent, GoogleMapOptions, CameraPosition, MarkerOptions, LatLng, Marker from '@ionic-native/google-maps';

我正在循环遍历多个 lat long 坐标并将它们添加到地图中。该事件永远不会因为其中任何一个而被触发。

当我尝试将偶数附加到其中一个标记时，它也不起作用。

最后，如果我发出另一个警报，它不会触发。是否有可能添加标记承诺没有解决？

this.map.addMarker(markerOptions).then((marker: Marker) => 
   alert('in here'); 
 marker.addEventListener(GoogleMapsEvent.MARKER_CLICK).subscribe(e => 
   alert('foo');
 );
);

【问题讨论】：

您使用什么版本的@ionic-native/core 和@ionic-native/google-maps？至少上面的代码应该可以工作。

@wf9a5m75 我添加了其他信息。谢谢您的帮助。我认为它应该工作，不知道我做错了什么

【参考方案1】：

你应该试试这个。对我来说效果很好

marker.on(GoogleMapsEvent.MARKER_CLICK).subscribe((latLng: LatLng) => 
    // do something
);

【讨论】：

很遗憾，您发布的代码不起作用。

【参考方案2】：

您需要使用@ionic-native/core@4.4.0 和@ionic-native/google-maps@4.4.0。 至少@ionic-native/core@3.7.0 太旧了。

$> npm uninstall @ionic-native/core @ionic-native/google-maps
$> cordova plugin rm cordova-plugin-googlemaps

$> npm install @ionic-native/core@latest @ionic-native/googlemaps@latest
$> cordova plugin add cordova-plugin-googlemaps --variable API_KEY_FOR_android="..." --variable API_KEY_FOR_ios="..." --no-fetch

从@ionic-native/google-maps@4.4.0开始，创建地图的方式发生了变化。

export class HomePage 

  map: GoogleMap;

  constructor()   // <-- no longer need to define in constructor
  

  ionViewDidLoad() 
    this.loadMap();
  

  loadMap() 
    this.map = GoogleMaps.create('map_canvas');  // <-- changed
    this.map.one(GoogleMapsEvent.MAP_READY).then(() => 
      ...
    );
  

【讨论】：

还是没有运气。呸呸呸。地图已创建，标记在地图上，但仍然没有点击事件。

您能否举例说明如何在地图上添加标记？它必须在one 函数中吗？我目前正在每次相机停止移动时加载标记。

在提问之前能不能先看一下文档站点？ github.com/mapsplugin/cordova-plugin-googlemaps-doc/blob/master/…docs.google.com/presentation/d/…

谢谢，是的，我已多次阅读此文档。我仍然不清楚我做错了什么。似乎对除我以外的所有人都有效，并且有很多例子可以证明它有效github.com/ionic-team/ionic-native/issues/1790我会一直把我的头撞到墙上。谢谢你的帮助我会告诉你我必须做什么