Google Maps v3 API：如何更新标记＆＃39;通过拖动改变路线时的位置？

Question

我正在尝试以下内容，基于GoogleMapsv3APIExample的示例：

• 我有一条从A到B的路线，带有一些标记：
• 我通过拖动“过渡航点”（用白色圆圈表示）修改路线
• 我希望将标记更新为新路线

我在 gist ：

中修改了相关示例

• 第37-39行我为 directions_changed 事件添加了一个监听器
• 在 recalculateMarkers 中，我将所有标记设置为null并将它们再次放置在地图上
• 似乎 directionsDisplay.directions 仍然包含旧路线（在拖动之前）
• 我得到的结果是：

有什么建议吗？

谢谢！

Answer 1

问题出在directions_changed事件中：当渲染的路线发生变化时，无论是设置了新的DirectionsResult还是用户完成将更改拖动到路线路径时，都会触发此事件。

当calcRoute()完成后，会创建两组标记：一组来自recalculateMarkers()，另一组来自calcRoute()。

必须将事件监听器移至calcRoute()并在路由成功的情况下进行设置：

function calcRoute() {

    var request = {
        origin: 'Sydney, NSW',
        destination: 'Broken Hill, NSW',
        travelMode: google.maps.TravelMode.DRIVING
    };

    directionsService.route(request, function(response, status) {
        if (status == google.maps.DirectionsStatus.OK) {
            directionsDisplay.setDirections(response);
            showSteps(response);

            google.maps.event.addListener(directionsDisplay, 'directions_changed', function() {
                console.log('directions_changed');
                recalculateMarkers();
            });
        }
    });
}

请参阅example at jsbin。