angular - ERROR TypeError: layer.addEventParent is not a function while setting marker for marker cluster in angular
问题描述
我在角度使用 ngx-leaflet-markercluster 来显示共享相同位置的标记簇。在设置标记时,它会给出错误 addeventparent is not a function 。
//ts
const data: Marker[] = res.map(loc => {
if (loc.STATUS === this.appConstantsService.OUTAGE_STATUS.INACTIVE) {
return { lat: loc.location_details_lat, lon: loc.location_details_lon, icon: '/assets/icons/marker-0.png' };
} else {
return { lat: loc.location_details_lat, lon: loc.location_details_lon, icon: 'assets/icons/marker-1.png' };
}
});
this.markerClusterData = data;
//html
<div leaflet style="height: 600px;"
[leafletOptions]="options"
[leafletBaseLayers]="baseLayers"
[leafletMarkerCluster]="markerClusterData"
[leafletMarkerClusterOptions]="markerClusterOptions"
(leafletMarkerClusterReady)="markerClusterReady($event)"
>
</div>
我希望标记在具有相同纬度和经度时出现在集群中,当我单击集群时,它应该放大并显示标记。首先我正在使用 agm 地图。当两个标记共享相同的纬度和经度时出现问题.我使用了 agm-marker-cluster 和 agm-maker-spider 但没有解决方案。有没有其他方法可以解决它
解决方案
我们必须使用标记类来添加标记
const data: Marker[] = res.map(loc => {
if (loc.STATUS === this.appConstantsService.OUTAGE_STATUS.INACTIVE) {
const icon = L.icon({ iconUrl: '/assets/icons/marker-0.png' });
return marker([loc.location_details_lat, loc.location_details_lon], { icon });
} else {
const icon = L.icon({ iconUrl: '/assets/icons/marker-1.png' });
return marker([loc.location_details_lat, loc.location_details_lon], { icon })
}
});