下面是我必须在我的程序中为谷歌地图上的绘制折线写的代码
假设response.SelectedTruck.length = 150
值包含在response.SelectedTruck中是纬度和经度
我必须将所有纬度和经度值推入m变量
//code for draw polyline
for (var i = 0; i < response.SelectedTruck.length; i++) {
var m = response.SelectedTruck[i];
(function (n) {
setTimeout(function () {
path.push(new google.maps.LatLng(parseFloat(n.lat), parseFloat(n.lang)));
addPolyline(path);
}, i * 1000);
}(m));
}
function addPolyline(m) {
var userCoordinate = new google.maps.Polyline({
path: m,
strokeColor: 'blue',
strokeOpacity: 2,
strokeWeight: 2,
icons: [{
icon: lineSymbol,
offset: '100%'
}]
});
userCoordinate.setMap(map);
}
对于这段代码,我在地图上绘制折线,然后我选择第一个ID,然后它将
在地图上绘制折线,但在我选择第二个ID然后选择旧的
折线未在地图上删除。如果我选择其他ID,如何删除折线?
答案 0 :(得分:1)
由于您只在一张地图上引用。你必须在之前绘制的折线上有一个参考,并将它的地图设置为空。
最简单的方法是全局声明userCoordinate变量并在创建新折线之前将地图设置为null
var userCoordinate;
.............
.............
function addPolyline(m) {
userCoordinate.setMap(null);
userCoordinate = new google.maps.Polyline({
path: m,
strokeColor: 'blue',
strokeOpacity: 2,
strokeWeight: 2,
icons: [{
icon: lineSymbol,
offset: '100%'
}]
});
userCoordinate.setMap(map);
}
另一种选择是创建一个新地图并将其用于新的折线(但它会导致地图重新加载)
function addPolyline(m) {
map = new google.maps.Map(document.getElementById('map'), {
zoom: 3,
center: {lat: 0, lng: -180},
mapTypeId: google.maps.MapTypeId.TERRAIN
});
var userCoordinate = new google.maps.Polyline({
path: m,
strokeColor: 'blue',
strokeOpacity: 2,
strokeWeight: 2,
icons: [{
icon: lineSymbol,
offset: '100%'
}]
});
userCoordinate.setMap(map);
}