删除在Google地图上呈现的路线

Question

我正在尝试做一些我以前做过的事已经做过很多次,虽然我在完成它时遇到了一些困难.

我有一个显示三个Google地图的网页.

对于每个谷歌地图,我有一个文本框,接受邮政编码/邮政编码,以及"获取路线"按钮.

单击其中每个按钮,使用google.maps.DirectionsService对象在以页面底部为中心的一个面板中显示一组方向.

当我试图通过再次搜索找到新的路线时,我的问题出现了.如下图所示,两条路线都会被渲染.

我最后在标记集合中有一个标记.

我现在已经阅读过几次关于如何循环遍历此数组并使用marker.setMap(null)清除此标记的内容.

但是,在每次特定搜索之后,我似乎无法清除实际路线.

有没有人从多个地图清除标记有任何问题？

你必须以某种方式完全重置地图吗？

如果你必须清除标记,那么你应该在过程的生命周期中的哪个阶段进行标记,以便在搜索后出现新的旅程,但是旧标记会被删除？

Answer 1

我为所有三个Google地图使用相同的google.maps.DirectionsService对象,并且它们都调用相同的方法来计算路线,但是将它们自己的地图对象作为参数传递.

function calcRoute(startPoint, location_arr) {
    // Create a renderer for directions and bind it to the map.
    var map = location_arr[LOCATION_ARR_MAP_OBJECT];
    var rendererOptions = {
    map: map
}

if(directionsDisplay != null) {
    directionsDisplay.setMap(null);
    directionsDisplay = null;
}

directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions);

directionsDisplay.setMap(map);

directionsDisplay.setPanel(document.getElementById("directionsPanel"));

要点是如果directionsDisplay!= null,我们不仅将null传递给setMap,我们也会在之后使整个对象无效,并且我发现它已经修复了它.