0

I have almost 500 markers, and these markers have another marker. These two markers are also in motion. It gets a location update every 10 seconds.

Black circle marker is main marker, blue one is connected marker: Black circle marker is main marker, blue one is connected marker

I control the connected marker into layer control.

When the map is first opened, the black marker moves one at 10 sec. After 1 minute, when I open the marker connected to the layer control, I see that it creates 5-6 markers in a row.

Expected result: As in the first photo, a black marker and connected marker should be one. They should move together.

Actual result: The connected marker creates lots of markers in the background of the map. When I click on the control, all the markers are shown on the map.

From the moment the map is first opened, all markers are formed and stored in the background. The black marker does not repeat itself on the map, but the other marker makes up all the locations.

layerGroup.removeLayer() can't delete markers that occur in the background. With layerGroup[1].clearLayer(), the situation becomes more complicated. This time, a marker disappears after 10 seconds and forms again.

A connected marker creates a marker by repeating it at all locations it passes through. A connected marker creates a marker by repeating it at all locations it passes through.

Is there a method I can delete markers that occur in the background? When the user stays on the map for a long time, the map slows down and freezes. Map performance crashes due to the fact that markers that occur in 10 seconds are not deleted.

getAllData() {
     this.subscribed = true;
     const source = timer(0, this.VEHICLE_DATA_REFRESH_TIME);
     this.timerSubscription = source.subscribe((val) => { 
          this.getMarkers(); 
     });
     this.subscriptions.push(this.timerSubscription);
}

getMarkers() {
    this.locationService.getLocation().subscribe((res) => {
       if (res.data) {
          res.data.location.forEach(item => {
             this.addMainMarker(item);
             this.addConnMarker(item);
          })
        }
     });
}

When debugging, all the markers appear in the background. Different location information for the same vehicles comes out. I need a bit method where I can delete them.

I'm using Angular, ngx-admin template

Laeflet version: "1.5.1"

ghybs
  • 47,565
  • 6
  • 74
  • 99
beste
  • 21
  • 1
  • 3
  • Frist please update your Leaflet Version to 1.7.1 and look if this issue is still happening – Falke Design Jul 01 '21 at 17:43
  • I tried to update to 1.7.1, but I keep getting the same result. – beste Jul 05 '21 at 10:39
  • Hi, in case you still need help: it seems to me that you try removing old Markers which may not have been added at all to the map (due to Layer Comtrol?). This seems to happen in your `addMainMarker` and `addConnMarker` methods, so showing their code is necessary to be able to provide more relevant help. – ghybs Sep 26 '21 at 11:55

0 Answers0