Javascript 如何在阵列中存储多个lat long并在航路点中访问它们以在它们之间创建路由？
我在GoogleMapAPI的java脚本部分添加了点击添加标记函数。我想单击多个标记并在它们之间创建一条管线。我能够放置标记，下一部分是将lat long存储在数组中，并访问路径点中的值，以便从标记的lat long访问路径点。我不想每次都手动给出lat long。这就是为什么要创建这个。请给我一些建议Javascript 如何在阵列中存储多个lat long并在航路点中访问它们以在它们之间创建路由？,javascript,arrays,ajax,google-maps,maps,Javascript,Arrays,Ajax,Google Maps,Maps,我在GoogleMapAPI的java脚本部分添加了点击添加标记函数。我想单击多个标记并在它们之间创建一条管线。我能够放置标记，下一部分是将lat long存储在数组中，并访问路径点中的值，以便从标记的lat long访问路径点。我不想每次都手动给出lat long。这就是为什么要创建这个。请给我一些建议 函数映射位置（）{ var值=[]； var方向显示； var directionsService=new google.maps.directionsService（）； var映射； 函数
函数映射位置（）{
var值=[]；
var方向显示；
var directionsService=new google.maps.directionsService（）；
var映射；
函数初始化（）{
directionsDisplay=new google.maps.DirectionsRenderer（）；
var chicago=new google.maps.LatLng（37.334818，-121.884886）；
变量映射选项={
缩放：7，
中心：芝加哥
};
map=new google.maps.map（document.getElementById（'map-canvas'），mapOptions）；
方向显示.setMap（地图）；
google.maps.event.addDomListener（document.getElementById（'routebtn'），'click'，calcRoute）；
google.maps.event.addListener（映射，'click'，函数（e）{
警报（e.latLng.lat（）+”，“+e.latLng.lng（））；
地点标记（如板条、地图）；
值={lat:e.latLng.lat（），lng:e.latLng.lng（）}；
navigator.geolocation.getCurrentPosition（函数（位置）{
var lat=位置坐标纬度；
var lon=位置坐标经度；
推力值（纬度、经度）；
});
});
}
功能位置标记（位置、地图）{
var marker=new google.maps.marker({
职位:职位,，
地图：地图
});
潘托地图（位置）；
}
函数calcRoute（）{
var a=新的google.maps.LatLng（values.lat，values.lng）；
//var end=new google.maps.LatLng（38.334818，-181.884886）；
var b=新的google.maps.LatLng（values.lat，values.lng）；
var bounds=new google.maps.LatLngBounds（）；
扩展（a）；
扩展（b）；
映射边界（bounds）；
var请求={
来源：a，
目的地：b，
航路点：[{位置：a，中途站：false}，
{位置：b，中途停留：false}]，
航路点：对，
travelMode:google.maps.travelMode.DRIVING
};
路由（请求、功能（响应、状态）{
if（status==google.maps.directionstatus.OK）{
方向显示。设置方向（响应）；
方向显示.setMap（地图）；
}否则{
警报（“从“+a.toUrlValue（6）+”到“+b.toUrlValue（6）+”的指令请求失败：”+状态）；
}
});
}
google.maps.event.addDomListener（窗口“加载”，初始化）；
}
mapLocation（）；
路由
html，正文，#地图画布{
身高：100%；
宽度：100%；
边际：0px；
填充：0px
}
函数mapLocation（）{
var值=[]；
var方向显示；
var directionsService=new google.maps.directionsService（）；
var映射；
函数初始化（）{
directionsDisplay=new google.maps.DirectionsRenderer（）；
var chicago=new google.maps.LatLng（37.54866603021222，-77.441193303331694）；
变量映射选项={
缩放：10，
中心：芝加哥
};
map=new google.maps.map（document.getElementById（'map-canvas'），mapOptions）；
方向显示.setMap（地图）；
google.maps.event.addDomListener（document.getElementById（'routebtn'），'click'，calcRoute）；
google.maps.event.addListener（映射，'click'，函数（e）{
警报（e.latLng.lat（）+”，“+e.latLng.lng（））；
地点标记（如板条、地图）；
控制台日志（如latLng）
push（{lat:e.latLng.lat（），lng:e.latLng.lng（）}）；
console.log（“值”，值）；
/*navigator.geolocation.getCurrentPosition（函数（位置）{
var lat=位置坐标纬度；
var lon=位置坐标经度；
推力值（纬度、经度）；
});*/
});
}
功能位置标记（位置、地图）{
var marker=new google.maps.marker({
职位:职位,，
地图：地图
});
潘托地图（位置）；
}
函数calcRoute（）{
console.log（值）；
var航路点_数据=[]；
var i；
对于（i=1；i <!DOCTYPE html>
<html>
<head>
<title>Routing</title>
<style>
html, body, #map-canvas {
height: 100%;
width: 100%;
margin: 0px;
padding: 0px
}
</style>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY_HERE&callback=mapLocation"></script>
<script>
function mapLocation() {
var values = [];
var directionsDisplay;
var directionsService = new google.maps.DirectionsService();
var map;
function initialize() {
directionsDisplay = new google.maps.DirectionsRenderer();
var chicago = new google.maps.LatLng(37.54866603021222, -77.44119330331694);
var mapOptions = {
zoom: 10,
center: chicago
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
directionsDisplay.setMap(map);
google.maps.event.addDomListener(document.getElementById('routebtn'), 'click', calcRoute);
google.maps.event.addListener(map, 'click', function(e) {
alert(e.latLng.lat() + ", " + e.latLng.lng());
placeMarker(e.latLng, map);
console.log(e.latLng)
values.push({lat:e.latLng.lat(),lng:e.latLng.lng()});
console.log("values",values);
/* navigator.geolocation.getCurrentPosition(function(position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
values.push(lat, lon);
});*/
});
}
function placeMarker(position, map) {
var marker = new google.maps.Marker({
position: position,
map: map
});
map.panTo(position);
}
function calcRoute() {
console.log(values);
var waypoints_data = [];
var i;
for(i = 1; i < values.length-1; i++){
var loc = new google.maps.LatLng(values[i]);
waypoints_data.push({location:loc,stopover: false});
}
/*var a = new google.maps.LatLng(values.lat, values.lng);
//var end = new google.maps.LatLng(38.334818, -181.884886);
var b = new google.maps.LatLng(values.lat, values.lng);
/*var c = new google.maps.LatLng(51.50748705717662, -0.13893842697143555);
var d = new google.maps.LatLng(51.50346856667175, -0.14929282090679408);
var e = new google.maps.LatLng(51.51083871071007, -0.1570619682540837);
var f = new google.maps.LatLng(51.51334975342731, -0.15831470489501953);
var g = new google.maps.LatLng(51.514163869310785, -0.1615037063827458);
var h = new google.maps.LatLng(51.51796947585254, -0.1516760925521794);
var i = new google.maps.LatLng(51.519611797295354, -0.1447636425947394);
var j = new google.maps.LatLng(51.51742202221118, -0.14268224839918275);
var k = new google.maps.LatLng(51.5138700899723, -0.14141624574415346);
var l = new google.maps.LatLng(51.50902430327333, -0.12421940501076278);
/*
var startMarker = new google.maps.Marker({
position: start,
map: map,
draggable: true
});
var endMarker = new google.maps.Marker({
position: end,
map: map,
draggable: true
});
*/
var bounds = new google.maps.LatLngBounds();
bounds.extend(values[0]);
bounds.extend(values[values.length-1]);
map.fitBounds(bounds);
var request = {
origin: values[0],
destination: values[values.length-1],
waypoints: waypoints_data,
//[{location: a, stopover: false},
//{location: b, stopover: false}],
/*{location: c, stopover: false},
{location: d, stopover: false},
{location: e, stopover: false},
{location: f, stopover: false},
{location: g, stopover: false},
{location: h, stopover: false},
{location: i, stopover: false},
{location: j, stopover: false},
{location: k, stopover: false},
{location: l, stopover: false}],*/
optimizeWaypoints: true,
travelMode: google.maps.TravelMode.DRIVING
};
directionsService.route(request, function (response, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
directionsDisplay.setMap(map);
} else {
alert("Directions Request from " + values[0].toUrlValue(6) + " to " + values[values.length-1].toUrlValue(6) + " failed: " + status);
}
});
}
google.maps.event.addDomListener(window, 'load', initialize);
}
mapLocation();
</script>
</head>
<body>
<input type="button" id="routebtn" value="route" />
<div id="map-canvas"></div>
</body>
</html>