Question

我正在尝试使用Google Distance Matrix API。 https://developers.google.com/maps/documentation/distance-matrix/start。我有必要的请求参数，这些参数是从当前位置（原始纬度）获得的，当我单击标记时（获得目标纬度）。现在，我试图在服务文件中调用该API，但无法正常工作。

以下是服务代码：下面是sendQuery对象中传递的请求参数。

apiKeyToPass: "this will be apikey"
srcDestinationLat: 29.9809683
srcDestinationLng: 31.3377553
srcOriginLat: 11.127122499999999
srcOriginLng: 78.6568942

我正在传递apikey来代替apikey。如何在下面的URL中传递上面的sendQuery参数，以便获得所需的响应。

getDistanceMatrix(sendQuery): Observable<any> {
       return this.http.get('https://maps.googleapis.com/maps/api/distancematrix/json?units=imperial&origins={{srcOriginLat}},{{srcOriginLng}}&destinations={{srcDestinationLat}},{{srcDestinationLng}}&key=apikey') 
    .map((response: Response) => {
        return response.json();
      })
      .catch(this.handleError);
  }

当我执行上述代码时，代码会进入异常循环，而不是进入响应循环。

Answer 1

@agm/core 的版本是 1.0.0，你还要安装@types/googlemaps。接下来需要导入

import {} from 'googlemaps';

进入你的组件。

您可能会看到如下错误：node_modules/@types/googlemaps/index.d.ts' is not a module。要更正此错误，只需在 src 目录中创建一个名为 index.d.ts 的文件并添加以下行：

declare module 'googlemaps';

要使用距离矩阵服务，请在您的组件中使用下一个：

public getDistance(origin: LatLng, destination: LatLng) {
const matrix = new google.maps.DistanceMatrixService();
return new Promise((resolve, reject)=>{
  matrix.getDistanceMatrix({
  origins: [new google.maps.LatLng(origin.lat, origin.lng)],
  destinations: [new google.maps.LatLng(destination.lat,destination.lng)],
  travelMode: google.maps.TravelMode.DRIVING,
  }, function(response, status) {
    if(status === 'OK'){
      resolve(response)
    }else{
      reject(response);
    }
  });
})

}

Answer 2

这对我有用：

public getDistancia(origen: string, destino: string) {
    return new google.maps.DistanceMatrixService().getDistanceMatrix({'origins': [origen], 'destinations': [destino], travelMode: 'DRIVING'}, (results: any) => {
        console.log('resultados distancia (mts) -- ', results.rows[0].elements[0].distance.value)
    });
}

如何在Angular中使用Google距离矩阵API

2 个答案: