Angular 6如何获取两个位置的AGM之间的距离 [英] Angular 6 How to Get Distance between two location AGM

问题描述

使用此引用 https:/，我在两点之间得到方向/www.npmjs.com/package/agm-direction 现在，我想获取/计算两个位置之间的距离，这令人困惑.

I get Direction between two points using this reference https://www.npmjs.com/package/agm-direction Now I want to get/calculate distance between two location and I'm Confusing how's do it.

在我的模块

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

在我的组件

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

我的问题:使用上述参考获取方向路径时，如何获得两点之间的距离?请给我建议(Google Map API等).我正在使用Angular 6

My Question : How I get distance between two point when I use above reference to get direction path ? Please give me suggestion ( Google map API etc). I'm using Angular 6

推荐答案

您需要使用Google Geometry API

You need to use Google Geometry API

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 Maps类型.在您的终端中运行:

Type to add allow Angular to use the Google Maps types. In your terminal run:

npm i -D @types/googlemaps

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

Time to tell Angular we are ready to use the Google Maps Types. Open your tsconfig.app.json and tsconfig.spec.json and add googlemaps to the types array inside of the compilerOptions object.

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

Note: I only put it on the tsconfig.app.json file some people have encounter issues and have to add it to both files I mentioned above.

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

或

关于@Abdelsalam Shahlol评论的注释:

Note on @Abdelsalam Shahlol comment:

对于Angular 6+，您不能从'@ types/googlemaps'导入{}； 而是将其放在TS文件的顶部(第一行).////node_modules/@types/googlemaps/index.d.ts"/>

For Angular 6+, you can't do this import {} from '@types/googlemaps'; Instead place this in top (first line) of the TS file. /// /node_modules/@types/googlemaps/index.d.ts"/>

在您的app.module.ts中

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

这篇关于Angular 6如何获取两个位置的AGM之间的距离的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！