Javascript 如何删除/替换先前绘制的多段线，以便在任何给定时间只有一条多段线？

理想情况下，我想要一条从最近的标记到静态位置的单线。我可以对距离进行排序，以找到最接近的标记并绘制到该标记的直线，但如果添加了新标记，并且比以前最接近的标记更接近，则会绘制新的多段线，而旧的多段线仍然存在

    var sorted = pathArr.sort(function (a, b) {
        var aValue = Math.abs(parseFloat(a['distance']));
        var bValue = Math.abs(parseFloat(b['distance']));

        if (typeof aValue && bValue == "number") {
            return (aValue > bValue) ? 1 : ((bValue > aValue) ? -1 : 0);
        }

        return (aValue > bValue) ? 1 : ((bValue > aValue) ? -1 : 0);
    });
    console.log(sorted);

    pathCoordinate = [{lat: lat1,  lng: lon1}, {lat: sorted[0].lat, lng: sorted[0].lng}];

    line = new google.maps.Polyline({
        path: pathCoordinate,
        geodesic: true,
        strokeColor: '#FF0000',
        strokeOpacity: 1.0,
        strokeWeight: 2
    });

    line.setMap(map);

我试过使用

    line.setMap(null);

---

但是如果行存在并且具有

setMap

方法，则在创建新行之前，将其

map

属性设置为null（将其从映射中删除）

var sorted = pathArr.sort(function(a, b) {
  var aValue = Math.abs(parseFloat(a['distance']));
  var bValue = Math.abs(parseFloat(b['distance']));

  if (typeof aValue && bValue == "number") {
    return (aValue > bValue) ? 1 : ((bValue > aValue) ? -1 : 0);
  }

  return (aValue > bValue) ? 1 : ((bValue > aValue) ? -1 : 0);
});
console.log(sorted);

pathCoordinate = [{
  lat: lat1,
  lng: lon1
}, {
  lat: sorted[0].lat,
  lng: sorted[0].lng
}];

if (line && line.setMap) line.setMap(null);
line = new google.maps.Polyline({
  path: pathCoordinate,
  geodesic: true,
  strokeColor: '#FF0000',
  strokeOpacity: 1.0,
  strokeWeight: 2
});

line.setMap(map);

代码片段：

var地理编码器；
var映射；
var pathArr=[]；
var lat1=37.4419；
变量lon1=-122.1419；
var线；
函数初始化（）{
map=新建google.maps.map(
document.getElementById（“地图画布”）{
中心：新google.maps.LatLng（37.4419，-122.1419），
缩放：13，
mapTypeId:google.maps.mapTypeId.ROADMAP
});
/*路径推({
拉脱维亚：37.4419，
液化天然气：-122.1419，
距离：google.maps.geometry.spherical.ComputedDistanceBeween（新的google.maps.LatLng（37.4419，-122.1419），map.getCenter（））
}); */
google.maps.event.addListener（映射，'click'，addPoint）；
}
google.maps.event.addDomListener（窗口“加载”，初始化）；
功能添加点（evt）{
路径推({
lat:evt.latLng.lat（），
lng:evt.latLng.lng（），
距离：google.maps.geometry.sphereal.ComputedDistanceBeween（evt.latLng，map.getCenter（））
});
var sorted=pathArr.sort（函数（a，b）{
var aValue=Math.abs（parseFloat（a['distance']）；
var bValue=Math.abs（parseFloat（b['distance']）；
if（aValue类型和&B值==“数字”）{
返回值（aValue>bValue）？1:（（bValue>aValue）？-1:0）；
}
返回值（aValue>bValue）？1:（（bValue>aValue）？-1:0）；
});
控制台日志（已排序）；
路径坐标=[{
lat:lat1，
液化天然气：lon1
}, {
lat:已排序[0]。lat，
lng:已排序[0]。lng
}];
if（line&&line.setMap）line.setMap（null）；
line=新的google.maps.Polyline({
路径：路径坐标，
测地线：正确，
strokeColor:“#FF0000”，
笔划不透明度：1.0，
冲程重量：2
});
line.setMap（map）；
}

html，
身体，
#地图画布{
身高：100%；
宽度：100%；
边际：0px；
填充：0px
}

确保行变量是全局定义的。很难说。没有足够的代码。“没有用”？我们需要更多的细节。您正在使用事件吗？如果行更改，则需要再次

.setMap（）

。非原始值也可能是一个问题。您在哪里尝试了

line.setMap（null）？请提供一份说明您的问题的报告。