Angular 6 如何获取两个位置 AGM 之间的距离

2024-04-13

I get 方向使用此参考在两点之间https://www.npmjs.com/package/agm-direction https://www.npmjs.com/package/agm-direction现在我想获取/计算distance在两个位置之间,我很困惑如何做到这一点。

In 我的模块

AgmCoreModule.forRoot({
  apiKey: 'My API Key....',
  libraries: ['geometry']
})

In 我的组件

getDirection() {
   this.origin = { lat: this.pick_latitude, lng: this.pick_longitude }
   this.destination = { lat: this.drop_latitude, lng: this.drop_longitude }
}

我的问题:当我使用上面的参考来获取方向路径时,如何获取两点之间的距离?请给我建议(谷歌地图API等)。我正在使用角度 6


您需要使用 Google 几何 API

https://developers.google.com/maps/documentation/javascript/geometry https://developers.google.com/maps/documentation/javascript/geometry

import {} from '@types/googlemaps';
import { AgmCoreModule, MapsAPILoader } from "@agm/core";

calculateDistance() {
    const mexicoCity = new google.maps.LatLng(19.432608, -99.133209.);
    const jacksonville = new google.maps.LatLng(40.730610, -73.935242.);
    const distance = google.maps.geometry.spherical.computeDistanceBetween(nyc, london);
  }

适用于 Angular 6+

添加允许 Angular 使用 Google 地图类型的类型。在您的终端中运行:

npm i -D @types/googlemaps

是时候告诉 Angular 我们已经准备好使用 Google 地图类型了。打开 tsconfig.app.json 并tsconfig.spec.json并将 googlemaps 添加到 compilerOptions 对象内部的 types 数组中。

注意:我只把它放在tsconfig.app.json文件有些人遇到了问题,必须将其添加到我上面提到的两个文件中。

   "compilerOptions": {
    "outDir": "./out-tsc/app",
    "types": ["googlemaps"]
   },

or

请注意 @Abdelsalam Shahlol 评论:

对于 Angular 6+,您无法执行此 import {} from '@types/googlemaps'; 而是将其放在 TS 文件的顶部(第一行)。 /// /node_modules/@types/googlemaps/index.d.ts"/>

在你的 app.module.ts 中

AgmCoreModule.forRoot({
  apiKey: 'YOUR API KEY',
  libraries: ['geometry']
}),
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angular 6 如何获取两个位置 AGM 之间的距离 的相关文章

随机推荐