有角度的传单图标不是相互替换，而是重叠的

Question

在我的ngOnInit上，我初始化了一些东西，比如地图上的标记。最初，它们都使用相同的图标进行初始化。每当我选择一个标记时，我都希望它变为"选定的图标"。然而，这里的问题是，我的程序没有用新图标替换旧图标。相反，它只是在当前图标的顶部添加图标，每当我选择第二个标记，并试图清除我最近选择的标记时，都不会发生任何事情(因为两个图标重叠(。

vehicleDetails: VehicleDetail[]; //array contains a bunch of VehicleDetail's.
// markers with vehicle IDs
markerAdv = Leaflet.Marker.extend({
options: {
vehicleId: ''
}
});
markers = new this.markerAdv();

// Set the icons across the map.
setMarkers(id: number) {
for (let i = 0; i < this.vehicleDetails.length; i++) {
// Creating the markers
this.markers = new this.markerAdv(
[
this.vehicleDetails[i].position.latitude,
this.vehicleDetails[i].position.longitude
],
{
icon: this.myBlueIcon,
vehicleId: this.vehicleDetails[i].id
}
)
.addTo(this.map)
.bindPopup(`${this.vehicleDetails[i].name} : ${status}  `)
.on('mouseover', function(e) {
this.openPopup();
})
.on('mouseout', function(e) {
this.closePopup();
})
.on(
'click',
function(event) {
this.updateInfo(event.target.options.vehicleId);
},
this
);
// Highlighting the marked vehicle
if (id === this.vehicleDetails[i].id) {
this.markers.setIcon(this.myBlueSelectedIcon);
} else {
this.markers.setIcon(this.myRedIcon);
}
}
}
}

我可以做些什么来避免这种重叠问题，而是在选择/清除图标时替换它？

Answer 1

以下是我的评论：当您将标记附加到传单地图时，它只会附加它们：它不会删除它们。

如果你想删除它们，你必须手动完成。

这是通过跟踪您的标记，并根据命令删除它们来完成的。

最好的跟踪器(当你有东西要识别你的标记时(是使用Map:

markers: Map<number, Leaflet.Marker> = new Map();