createMarker missing in L.Routing.control options

[dmaglio]

I would like to use the CreateMarker function but it is not available within L.Routing.Control This is my code and under the VSCODE error message

const control = L.Routing.control({
      router: L.Routing.osrmv1({
        serviceUrl: environment.osrmUrl
      }),
      showAlternatives: false,
      routeWhileDragging: false,
      // lineOptions: { styles: [{ color: '#242c81', weight: 7 }] },
      fitSelectedRoutes: false,
      // altLineOptions: { styles: [{ color: '#ed6852', weight: 7 }] },
      collapsible: true,
      waypoints: this.route,
      createMarker: function (i, wp, nWps) {
        var icon = L.icon.glyph({
          prefix: '',
          glyph: String.fromCharCode(65 + i)
        });
        return L.marker(wp.latLng, { draggable: false, icon: icon })
          .bindPopup(wp.name);
      },

    }).addTo(map);

Argument of type '{ router: OSRMv1; showAlternatives: false; routeWhileDragging: false; fitSelectedRoutes: false; collapsible: true; waypoints: any[]; createMarker: (i: any, wp: any, nWps: any) => Marker<any>; }' is not assignable to parameter of type 'RoutingControlOptions'.
  Object literal may only specify known properties, and 'createMarker' does not exist in type 'RoutingControlOptions'.

i use leaflet-routing-machine v.3.2.12

[rafaneri]

@dmaglio, you need to use the L.Routing.Plan, plan has the createMarker function.

const plan = new L.Routing.Plan(waypoints, {
    createMarker: (i, wp, nWps) => {
        return L.marker(wp.latLng).bindPopup('Message');
    },
});

const control = L.Routing.control({
    show: false,
    waypoints,
    routeWhileDragging: false,
    plan,
    addWaypoints: false,
}).addTo(map);

[BrayceFepa]

Hello, please what could I do if I want to hide markers ?

[curtisy1]

@BrayceFepa This is a more or less unrelated problem, so please open a new issue next time. Doing so helps me to keep track of what is currently not working and needs to be addressed.

That being said, what you could do is take the code above and modify the createMarker function to return an invisible marker by setting its opacity to 0 and making it non-interactive

createMarker: (i, wp, nWps) => {
        return L.marker(wp.latLng, { interactive: false, opacity: 0 });
    },