Discussion :

[Gregory_007]

Bonjour à tous,

je rencontre un souci pour effacer les traces et les marqueurs dans Google maps.

J'ai conçu des traqueurs GPS (voitures x 2 et animaux x 2). Je veux, selon le cas, afficher un ou des éléments à suivre. Je récupère convenablement les données GPS de chaque élément pour les afficher dans Google maps, mais je n'arrive plus à les effacer de façon indépendamment. Par exemple, si j'affiche sur la carte 2 traces, celles pour mes animaux et que je veux en supprimer une, rien ne se passe. Une fois les traces (même une seule trace) affichées sur la carte, je n'arrive pas à les enlever. Pourriez-vous m'aider à trouver mon problème ?

Merci

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
var LINE = {};
var POINTS = {};
var MARKER = {};
var positions = [];
var ACTIVATION = [];
var DESACTIVATION = [];
 
async function GOOGLE_MARK()   // Chaque 5 secondes, cette fonction est exécutée
{
    for (var i = 0; i < ACTIVATION.length; i++)  // ACTIVATION = les UID des TRACKER que j'active pour recevoir les points GPS
    {
        var GPS_DATA = await GET_GPS_DATA(ACTIVATION[i],1);  // Le dernier point GPS est un dictionnaire style {'lat': 45.76545, 'lng': 5.7647} dans la variable GPS_DATA (fonctionne)
 
        if (GPS_DATA != null)
        {
            for (var j = 0; j < Object.keys(GPS_DATA).length; j++ )
            {
                positions.push(GPS_DATA[Object.keys(GPS_DATA)[j]]);
            }
            POINTS[ACTIVATION[i]] = positions;   // J'accumule les coordonnées dans un dictionnaire pour chaque élément que je veux suivre (fonctionne)
 
        }
        createPolyline(ACTIVATION[i]);  // fonction pour afficher les lignes et les marqueurs
    }
    for (var i = 0; i < DESACTIVATION.length; i++)   // efface normalement les lignes et les marques (ne fonctionne pas)
    {
        console.log(DESACTIVATION[i]);
        removePolyline(DESACTIVATION[i]);
        removeMarker(DESACTIVATION[i]);
    }
}
 
function createPolyline(NUMTRACKER) {
    const path = [];
    for (const position of POINTS[NUMTRACKER]) {
      path.push(new google.maps.LatLng(position.lat, position.lng));
    }
 
 
     LINE[NUMTRACKER] = new google.maps.Polyline({    // Affiche les lignes pour chaque élément (fonctionne)
      path,
      strokeColor: '#0000FF',
      strokeOpacity: 0.8,
      strokeWeight: 2,
    });
 
    console.log(LINE[NUMTRACKER])
    LINE[NUMTRACKER].setMap(map);     // Affiche les lignes pour chaque élément (fonctionne)
 
function removePolyline(id)   // Efface les lignes (ne fonctionne pas)
{
    if (LINE[id]) 
    {
    LINE[id].setMap(null);
    delete LINE[id];
    }
}
 
function removeMarker(id) {   // Efface les marqueurs (ne fonctionne pas)
    if (MARKER[id]) {
      MARKER[id].setMap(null);
      delete MARKER[id];
    }
  }

[NoSmoking]

Bonjour,
j'ai du mal à voir ce que contient ACTIVATION[i].

Concernant ton objet LINE j'aurais, à priori, utilisé un Array.
Quelque chose comme :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
const LINE = [];
//....
const polyline = new google.maps.Polyline({ // Affiche les lignes pour chaque élément (fonctionne)
    path,
    strokeColor: '#0000FF',
    strokeOpacity: 0.8,
    strokeWeight: 2,
  })
  .setMap(map);
LINE.push(polyline);

et pour la fonction de suppression

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
function removePolyline(id) {
  const index = LINE.indexOf(id);
  if (index > -1) {
    LINE[index].setMap(null);
    LINE.splice(index,1);
  }
}

voilà à la louche.