leafletleaflet-routing-machine

How to replace default marker to custom icon in waypoint (Leaflet Routing)


Here, I am drawing route and assigning stop to route using Leaflet Routing Machine Leaflet Routing Machine

var control = L.Routing.control(L.extend(window.lrmConfig, {
    waypoints: [array object of stops],
    geocoder: L.Control.Geocoder.nominatim(),
    routeWhileDragging: true,
    reverseWaypoints: true,
    showAlternatives: true,
    altLineOptions: {
        styles: [
            {color: 'black', opacity: 0.15, weight: 9},
            {color: 'white', opacity: 0.8, weight: 6},
            {color: 'blue', opacity: 0.5, weight: 2}
        ]
    }
})).addTo(map);

In waypoints object array I have bind custom marker like:

L.marker([item.latLng.lat, item.latLng.lng], {icon: stopIcon}).addTo(map).bindPopup(item.name);

But I am getting 2 markers 1 is default and second is my custom icon. You can see in my screen-shot one is default(blue marker) and custom icon(stop image)

screenshot

So I want to replace default (blue marker) with my custom and remove the default marker. Thanks.


Solution

  • Finally, I found a solution. Added property

    createMarker: function() { return null; },