我正在尝试做一些我以前收集的事情,尽管我在完成任务时遇到了一些困难。

我有一个网页,显示三个Google map 。

对于每个这些Google map ,我都有一个接受邮政编码/邮政编码的文本框,以及一个“获取路线”按钮。

点击这些按钮中的每个按钮,即可使用google.maps.DirectionsService对象在页面底部居中的一个面板中显示一组方向。

当我尝试通过再次搜索找到新路线时,就会出现我的问题。如您在下图中所看到的,两条路线都被渲染。


我在标记集合的末尾有一个标记。

现在,我已经阅读了几次有关如何遍历此数组并使用marker.setMap(null)清除此标记的信息。

但是,每次执行特定搜索后,我似乎都无法清除实际路线。

有人从多个 map 上清除标记时遇到任何问题吗?

您是否需要以某种方式完全重置 map ?

如果必须清除标记,则应在流程的生命周期中的什么时候进行标记,以便在搜索之后出现新的旅程,但旧的旅程被删除了?

最佳答案

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

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,还会使afterafterds后的整个对象无效,而我发现此问题已得到解决。

关于javascript - 删除在Google map 上呈现的路线,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/7886110/

10-11 23:30
查看更多