![航点]( "航点")
本文介绍了使用经度/纬度作为航点的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在尝试使用经度纬度作为我的谷歌地图中的航点，但似乎无法正常工作.
这就是我如何推动我的价值观
waypts_mtlsheloc.push({location: (45.658197,-73.636333),//我不认为我应该这样写.但是找不到正确的方法.中途停留:真的})
然后尝试像这样修改我的行
service.route({原点:latlng_mtlsheloc[0]，目的地:latlng_mtlsheloc[latlng_mtlsheloc.length - 1]，航点:waypts_mtlsheloc，旅行模式:google.maps.DirectionsTravelMode.DRIVING}，功能(结果，状态){控制台日志(状态)如果(状态 == google.maps.DirectionsStatus.OK){path = path.concat(result.routes[0].overview_path);line_mtlsheloc.setPath(result.routes[0].overview_path);}});
但它给了我一个错误属性 [航点] 中的错误"，我尝试了不同的写下位置的方法，但似乎找不到正确的方法.
解决方案
要使用纬度和经度作为航点，它必须是一个 google.maps.LatLng 对象(文档 表示一个字符串或 LatLng；字符串是一个地址, LatLng 是地理坐标)
waypts_mtlsheloc.push({位置:新的 google.maps.LatLng(45.658197,-73.636333)，中途停留:真的})
工作示例
jsfiddle
代码片段:
var directionDisplay;var directionService = new google.maps.DirectionsService();无功地图；函数初始化(){方向显示 = 新 google.maps.DirectionsRenderer();var 芝加哥 = 新 google.maps.LatLng(41.850033, -87.6500523);var myOptions = {变焦:6，mapTypeId: google.maps.MapTypeId.ROADMAP,中心:芝加哥}map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);DirectionsDisplay.setMap(地图);calcRoute();}函数 calcRoute() {无功请求 = {产地:1521 NW 54th St, Seattle, WA 98107"，目的地:加利福尼亚州圣地亚哥"，航点:[{位置:新的 google.maps.LatLng(42.496403, -124.413128)，中途停留:假}],优化航路点:真，旅行模式:google.maps.DirectionsTravelMode.WALKING};路线Service.route(请求，功能(响应，状态){如果(状态 == google.maps.DirectionsStatus.OK){DirectionsDisplay.setDirections(响应)；var route = response.routes[0];var summaryPanel = document.getElementById("directions_panel");summaryPanel.innerHTML = "";//对于每个路由，显示摘要信息.for (var i = 0; i < route.legs.length; i++) {var routeSegment = i + 1;summaryPanel.innerHTML += "<b>Route Segment:" + routeSegment + "</b><br/>";summaryPanel.innerHTML += route.legs[i].start_address + " to ";summaryPanel.innerHTML += route.legs[i].end_address + "
";summaryPanel.innerHTML += route.legs[i].distance.text + "<br/><br/>";}} 别的 {警报(方向响应"+状态)；}});}google.maps.event.addDomListener(window, "load", initialize);
html {高度:100%}身体 {高度:100%；边距:0px；填充:0px}
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></脚本><div id="map_canvas" style="float:left;width:70%;height:100%;"></div><div id="control_panel" style="float:right;width:30%;text-align:left;padding-top:20px"><div id="directions_panel" style="margin:20px;background-color:#FFEE77;"></div>
I'm trying to use the longitude latitude as a waypoint in my google maps and cant seem to get it working.
Here's how I have my values pushed
waypts_mtlsheloc.push({
location: (45.658197,-73.636333), //I don't think I'm supposed to write this like that. But can't find the right way.
stopover: true
})
And then try to modify my line like this
service.route({
origin: latlng_mtlsheloc[0],
destination: latlng_mtlsheloc[latlng_mtlsheloc.length - 1],
waypoints:waypts_mtlsheloc,
travelMode: google.maps.DirectionsTravelMode.DRIVING
}, function(result, status) {
console.log(status)
if (status == google.maps.DirectionsStatus.OK) {
path = path.concat(result.routes[0].overview_path);
line_mtlsheloc.setPath(result.routes[0].overview_path);
}
});
But it gives me an error "Error in property [waypoint]", I've tried different methods of writing down the location, but can't seem to find the right one.
解决方案
To use a latitude and longitude as a waypoint, it must be a google.maps.LatLng object(the documentation says a string or a LatLng; string is an address, LatLng is geographic coordinates)
waypts_mtlsheloc.push({
location: new google.maps.LatLng(45.658197,-73.636333),
stopover: true
})
Working Example
jsfiddle
code snippet:
var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var map;
function initialize() {
directionsDisplay = new google.maps.DirectionsRenderer();
var chicago = new google.maps.LatLng(41.850033, -87.6500523);
var myOptions = {
zoom: 6,
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: chicago
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
directionsDisplay.setMap(map);
calcRoute();
}
function calcRoute() {
var request = {
origin: "1521 NW 54th St, Seattle, WA 98107 ",
destination: "San Diego, CA",
waypoints: [{
location: new google.maps.LatLng(42.496403, -124.413128),
stopover: false
}],
optimizeWaypoints: true,
travelMode: google.maps.DirectionsTravelMode.WALKING
};
directionsService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
var route = response.routes[0];
var summaryPanel = document.getElementById("directions_panel");
summaryPanel.innerHTML = "";
// For each route, display summary information.
for (var i = 0; i < route.legs.length; i++) {
var routeSegment = i + 1;
summaryPanel.innerHTML += "<b>Route Segment: " + routeSegment + "</b><br />";
summaryPanel.innerHTML += route.legs[i].start_address + " to ";
summaryPanel.innerHTML += route.legs[i].end_address + "<br />";
summaryPanel.innerHTML += route.legs[i].distance.text + "<br /><br />";
}
} else {
alert("directions response " + status);
}
});
}
google.maps.event.addDomListener(window, "load", initialize);
html {
height: 100%
}
body {
height: 100%;
margin: 0px;
padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
<div id="map_canvas" style="float:left;width:70%;height:100%;"></div>
<div id="control_panel" style="float:right;width:30%;text-align:left;padding-top:20px">
<div id="directions_panel" style="margin:20px;background-color:#FFEE77;"></div>
</div>
这篇关于使用经度/纬度作为航点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！