使用Ionic @capacitor/google-maps在两条路线之间搜索Map方向

3zwtqj6y  于 2023-02-06  发布在  Ionic
关注(0)|答案(2)|浏览(167)

我正在开发一个出租车应用程序,我需要显示两个位置之间的方向。当客户点击导航,我需要做实时跟踪就像谷歌Map应用程序。
以下是我目前所做的工作,
//获取用户当前位置

this.coordinates = await Geolocation.getCurrentPosition();

//创建Map

this.newMap = await GoogleMap.create({
  id: 'my-map',
  element: this.mapRef.nativeElement,
  apiKey: APIKEY,
  config: {
    center: {
      lat: 33.6,
      lng: -117.9,
    },
    zoom: 8,
  },
});

现在,我如何实现实时跟踪功能?请帮助我进行基本设置。

nhjlsmyf

nhjlsmyf1#

1.你需要添加一个地理位置监听器来在位置改变时获取它。
1.将新位置推送到一个数组中并在Map上显示该位置。

nfs0ujit

nfs0ujit2#

您可以使用https://github.com/apache/cordova-plugin-geolocation

navigator.watchPosition().subscribe((resp) => {
  this.latitude = resp.coords.latitude;
  this.longitude = resp.coords.longitude;

  if (!this.marker) {
    this.marker = new google.maps.Marker({
      position: new google.maps.LatLng(this.latitude, this.longitude),
      map: this.map,
      title: 'Current Location'
    });
  } else {
    this.marker.setPosition(new google.maps.LatLng(this.latitude, this.longitude));
  }
});

watchPosition()方法订阅设备位置的更新。if语句检查标记对象是否存在,如果不存在,则创建一个新标记。如果标记对象已经存在,则更新标记的位置。
这只是一个基本的例子,你可以自定义标记添加图标和其他东西。
别忘了添加iOS和Android所需的权限。

相关问题