问题描述
下一个问题是显示来自基本JSON的路由.
I have the next problem to display a route from basic JSON.
- 我在后端执行一次此调用:
卷曲到https://maps.googleapis.com/maps/api/directions/json - 我将响应json发送回前端
- 在前端，我尝试仅出于视觉目的呈现路由，为什么不使用Google v3 API获取routeResponse对象的原因是，我不想与后端使用相同的配置并在前端转换为requestObejct
- 我尝试基于googleapi的后端json创建routeResponse json:
data.overviewRouteDirectionSteps.bounds = new google.maps.LatLngBounds(
data.overviewRouteDirectionSteps.bounds.southwest,data.overviewRouteDirectionSteps.bounds.northeast);
data.overviewRouteDirectionSteps.overview_path=google.maps.geometry.encoding.decodePath(data.overviewRouteDirectionSteps.overview_polyline.points);
data.overviewRouteDirectionSteps.overview_polyline = data.overviewRouteDirectionSteps.overview_polyline.points;
directionsDisplay.setDirections({
request: {
travelModel: 'DRIVING'
},
routes: [data.overviewRouteDirectionSteps]
});
问题是我看到起点和终点标记+腿点，但看不到线:
The problem is I see the start and end markers + legs points but don't see the line:
我应该怎么做才能拥有正确的显示路线?与流程代码类似:
What should I do to have a correct display routes ?Similar with the flow code:
directionsService.route(request, function(response, status) {
if (status === 'OK') {
console.log(response);
directionsDisplay.setDirections(response);
} else {
console.log('Directions request failed due to ' + status);
}
})
推荐答案
鉴于您向Directions网络服务提出了后端请求，并且要将完整的响应传递给前端，则需要为它们处理结果以成为有效的DirectionResult对象.这是我的方法:
Given you made a backend request to Directions webservice, and you're passing the complete response to your frontend, you'll need to process the results for them to become a valid DirectionResult object. This is how I'd do it:
if (response.status === 'OK') {
var bounds = new google.maps.LatLngBounds(response.routes[0].bounds.southwest, response.routes[0].bounds.northeast);
response.routes[0].bounds = bounds;
response.routes[0].overview_path = google.maps.geometry.encoding.decodePath(response.routes[0].overview_polyline.points);
response.routes[0].legs = response.routes[0].legs.map(function (leg) {
leg.start_location = new google.maps.LatLng(leg.start_location.lat, leg.start_location.lng);
leg.end_location = new google.maps.LatLng(leg.end_location.lat, leg.end_location.lng);
leg.steps = leg.steps.map(function (step) {
step.path = google.maps.geometry.encoding.decodePath(step.polyline.points);
step.start_location = new google.maps.LatLng(step.start_location.lat, step.start_location.lng);
step.end_location = new google.maps.LatLng(step.end_location.lat, step.end_location.lng);
return step;
});
return leg;
});
directionsDisplay.setDirections(response);
}
基本上，当您使用 google.maps.DirectionsService 时，上课时，图书馆代表您来照顾一下两个演员之间的相互关系:
Basically, when you use the google.maps.DirectionsService class, the library takes care, on your behalf, to transform to and from two actors:
-
路由服务(后端 Directions API )负责为我如何从A到B"问题提供路线解决方案?它不假设您将使用其结果的方式.
The routing service (backend Directions API) in charge of providing a route solution for the question "how do I get from A to B"? It makes no assumptions about the way you will use its result.
绘图服务(前端 google.maps.DirectionsRenderer类)，负责向用户展示通用(但详细)路线的视觉表示.只要提供正确的结构，它就不会假设您从哪里获得路由解决方案(它期望 google.maps.DirectionsResult ).
The drawing service (frontend google.maps.DirectionsRenderer class) in charge of showing the user the visual representation of a generic (but detailed) route. It makes no assumptions on where did you get the routing solution from as long as you feed it the right structure (it is expecting an instance of google.maps.DirectionsResult).
当您选择使用curl或任何其他服务器端库来请求路线时，您填补了翻译前端 google.maps.DirectionsRequest 对象转换为正确的URL编码的 Directions API请求.现在，您需要将 Directions API响应转换为 google.maps.DirectionsResult .
When you chose to use curl or any other server side library to request for directions, you filled the gap to translate the frontend google.maps.DirectionsRequest object into a properly URL encoded Directions API Request. Now you need to translate the Directions API Response back into an instance of google.maps.DirectionsResult.
即使JSON结果主要是一个对象，渲染器也不会也不应该假定应该使用普通对象来实例化路径，路线，位置或支腿.
Even if the JSON result is mostly an object, the renderer does not and should not assume that a plain object should be used to instance paths, routes, positions or legs.
这篇关于来自json的Google Maps显示路线的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！