感谢您的时间 .
Brief:
-
Google Maps API V3项目
-
点击 Map 放置标记
-
Directions Service计算两个连续点之间的路线
Goal:
拖动其中一个标记时重新计算路径 .
Progress:
到目前为止，我已经收集了这个页面：http://test.bluecactus.ro/gmaps.html . 我评论了大部分代码 .
Problem:
页面适用于第一次拖动 . 当我拖动第二个标记或再次拖动第一个标记时，折线不再按它们的方式“重新生成”（删除传入和传出，从新位置计算，在 Map 上绘图） .
对于同一标记上的多个拖动，应删除的一些折线将保留在 Map 上 . 在拖动第二个标记时，将删除错误的折线 .
这让我相信识别拖动标记在阵列中的位置是错误的，该阵列中包含所有标记;功能如下 . 我已多次重做'math' - 在纸面上似乎没问题 . 我已经尝试将所有内容放在for循环之外，并使用循环来识别全局变量中的位置 . 他们都没有工作 .
http://test.bluecactus.ro/gmaps.html
google.maps.event.addListener(marker, 'dragend', function(event) { //ondrag
for (var i = 0; i < gmarkers.length; i++) {
if(gmarkers[i].getPosition() == marker.getPosition()) { //find out array position of current marker
console.log("i = " + i);
//hide incoming and outgoing polylines; polylines index offset by -1 (n markers => n-1 polylines)
gpolys[i-1].setMap(null);
gpolys[i].setMap(null);
drawPath(gmarkers[i-1].getPosition(), marker.getPosition()); //calculate route between moved marker and previous point
drawPath(marker.getPosition(), gmarkers[i+1].getPosition()); //calculate route between moved marker and next point
//overwrite initial polylines; drawPath function automatically adds new polylines to end of gpolys array
gpolys[i-1] = gpolys[gpolys.length-2];
console.log(gpolys);
gpolys[i] = gpolys[gpolys.length-1];
console.log(gpolys);
//delete last 2 elements from gpolys
gpolys.pop();
console.log(gpolys);
gpolys.pop();
console.log(gpolys);
}
}
});
Notes ：
-
第一个和最后一个标记不起作用，暂时不处理它们 .
-
我发现了一些解决方法：在拖动时重新计算整个路径 - 获取数组中的所有标记并在i＆i 1之间绘图;但是这只适用于较小的路线而且没有拖动到快速 - 否则将被击中OVER_QUERY_LIMIT . 可以通过调用之间的延迟来解决，但是每次重新计算一切只是一点似乎很奇怪 .
我觉得我接近解决方案，但无法掌握它 . 任何建议将不胜感激 . 谢谢 .
1 回答
您不需要自己实现拖动方向，它自2010年以来就已经是JavaScript API v3的一部分 . 您可以在航点上设置标记，但路线中的任何点都是可拖动的 .
https://developers.google.com/maps/documentation/javascript/examples/directions-draggable https://developers.google.com/maps/documentation/javascript/directions#DraggableDirections