@ -9,6 +9,7 @@ import {
import { FormsModule } from '@angular/forms' ; import { FormsModule } from '@angular/forms' ;
import { ActivatedRoute , Router } from '@angular/router' ; import { ActivatedRoute , Router } from '@angular/router' ;
import * as L from 'leaflet' ; import * as L from 'leaflet' ;
import 'leaflet.markercluster' ;
import { Pin } from '../../model/Pin' ; import { Pin } from '../../model/Pin' ;
import { AutocompleteService } from '../../services/auto-complete/auto-complete.service' ; import { AutocompleteService } from '../../services/auto-complete/auto-complete.service' ;
import { MapReloadService } from '../../services/map-reload/map-reload.service' ; import { MapReloadService } from '../../services/map-reload/map-reload.service' ;
@ -26,6 +27,7 @@ import { IntroService } from '../../services/intro/intro.service';
export class LeafletMapComponent implements OnInit { export class LeafletMapComponent implements OnInit {
private map ! : L . Map ;
private map ! : L . Map ;
private markersMap : { [ key : string ] : L . Marker } = { } ;
private markersMap : { [ key : string ] : L . Marker } = { } ;
private markerClusterGroup ! : L . MarkerClusterGroup ;
private allPins : Pin [ ] = [ ] ;
private allPins : Pin [ ] = [ ] ;
private pinCountries : { [ pinId : string ] : string } = { } ;
private pinCountries : { [ pinId : string ] : string } = { } ;
private contextMenu : L.Popup | null = null ;
private contextMenu : L.Popup | null = null ;
@ -91,6 +93,10 @@ export class LeafletMapComponent implements OnInit {
} ) . addTo ( this . map ) ;
} ) . addTo ( this . map ) ;
this . map . attributionControl . setPrefix ( '' ) ;
this . map . attributionControl . setPrefix ( '' ) ;
// Initialiser le groupe de clusters
this . markerClusterGroup = L . markerClusterGroup ( ) ;
this . map . addLayer ( this . markerClusterGroup ) ;
// Ajouter l'événement de clic droit sur la carte
// Ajouter l'événement de clic droit sur la carte
this . map . on ( 'contextmenu' , ( e : L.LeafletMouseEvent ) = > {
this . map . on ( 'contextmenu' , ( e : L.LeafletMouseEvent ) = > {
e . originalEvent . preventDefault ( ) ;
e . originalEvent . preventDefault ( ) ;
@ -242,6 +248,7 @@ export class LeafletMapComponent implements OnInit {
Object . values ( this . markersMap ) . forEach ( ( marker ) = >
Object . values ( this . markersMap ) . forEach ( ( marker ) = >
this . map . removeLayer ( marker )
this . map . removeLayer ( marker )
) ;
) ;
this . markerClusterGroup . clearLayers ( ) ;
this . markersMap = { } ;
this . markersMap = { } ;
const visitedIcon = this . createDivIcon ( `
const visitedIcon = this . createDivIcon ( `
@ -316,6 +323,7 @@ export class LeafletMapComponent implements OnInit {
}
}
} )
} )
. unsubscribe ( ) ;
. unsubscribe ( ) ;
this . markerClusterGroup . addLayer ( marker ) ;
} ) ;
} ) ;
}
}
