title: How to display updated markers, leaflet
body: <p>Good morning all
  I would like to have a position tracking with the leaflet.
  I managed to display the markers with the positions update every 5 seconds by javascript on an XML file.</p>
  <p>I have 2 problems.</p>
  <p>The first: the data is well recovered and the markers well positioned, but the markers not being removed from the screen before being re-displayed the old positions remains on the screen.
  I tried the technique recommended here (<a href="https://stackoverflow.com/questions/9912145/leaflet-how-to-find-existing-markers-and-delete-markers?newreg=61a0ebb8c4444daa8570a1464f43d9f6">Leaflet - How to find existing markers, and delete markers?</a>) but without success. My idea was to do a remove.layer of the markers just before redisplaying them when the position data is up to date.</p>
  <pre><code>  var personnes = L.layerGroup();
  
    var map_bus = L.map(
        &quot;map_bus&quot;,
        {
            center: [&lt;? echo $_GET['lat'] ?&gt;, &lt;? echo $_GET['lon'] ?&gt;],
            crs: L.CRS.EPSG3857,
            zoom: 17,
            zoomControl: true,
            preferCanvas: false,
            layers: [personnes]
  
        }
    );
     var myVar = setInterval(chargerXML, 5000);
  
  
  
     function chargerXML() {
       var xhttp = new XMLHttpRequest();
       xhttp.onreadystatechange = function() {
         if (this.readyState == 4 &amp;&amp; this.status == 200) {
           myFunction(this);
         }
       };
       xhttp.open(&quot;GET&quot;, &quot;connectes4.xml&quot;, true);
       xhttp.send();
     }
     function myFunction(xml) {
       var i;
       var xmlDoc = xml.responseXML;
       var x = xmlDoc.getElementsByTagName(&quot;personne&quot;);
  
       map_bus.removeLayer(personnes);
  
       for (i = 0; i &lt;x.length; i++) {
         var nomPersonne = x[i].getElementsByTagName(&quot;nom&quot;)[0].childNodes[0].nodeValue;
         var latitude = x[i].getElementsByTagName(&quot;nom&quot;)[0].getAttribute(&quot;LAT&quot;);
         var longitude = x[i].getElementsByTagName(&quot;nom&quot;)[0].getAttribute(&quot;LON&quot;);
         if (x[i].getElementsByTagName(&quot;nom&quot;)[0].childNodes[0].nodeValue  == &quot;&lt;? echo $_GET['pseudo'] ?&gt;&quot;){
            marker = L.marker([latitude,longitude], {icon:IconStyleTwo}).bindPopup(nomPersonne);
            marker.addTo(personnes);
         }
         else  {
           marker = L.marker([latitude,longitude], {icon:IconStyleThree}).bindPopup(nomPersonne);
           marker.addTo(personnes);
         }
       }
  </code></pre>
  <p>My second problem is to be able to save the position and save it with PHP on the server in an XML file.
  I don't know how to articulate javascript with PHP.
  Thanks in advance for your advice.</p>