Leaflet-Realtime plugin with GeoJson and multiple markers

Question

Hello guys i am trying to update my markers position but i don't manage to find out how to remove the old ones. All i get is a "history" of the marker. I didnt any examples that will help me. I hope someone will give me a clue to go on. Many thanks to Per Liedman for the awesome job.

                    var shipLayer = L.layerGroup();
                    var ships = L.icon({
                        iconUrl: '../icons/ship-icon.png',
                        iconSize: [30, 30]
                    });
                    var realtime = L.realtime({
                        url: 'jsonServlet/ships.json',
                        crossOrigin: true,
                        type: 'json'
                    }, {
                        interval: 5 * 1000,
                        pointToLayer: function (feature, latlng) {

                            marker = L.marker(latlng, {icon: ships});
               marker.bindPopup('mmsi: ' + feature.properties.mmsi +
                               '<br/> course:' + feature.properties.hdg+
                               '<br/> speed:' + feature.properties.sog);
                               marker.addTo(shipLayer);
                               return marker;
                        }                            
                    });  
                  controlLayers.addOverlay(geojson, 'Ships');

Answer 1

By default L.realtime uses the id property of a feature to update it. As you explained in the comments, the identifier of your ships are in the GeoJSON feature's mmsi property and there is no id. You will need to add this to your L.realtime setup in options:

getFeatureId: function(featureData){
    return featureData.properties.mmsi;
}

See here: https://jsfiddle.net/chk1/hmyxb6ur/