iconUrl - How to prevent default icons from displaying?

Maps SDK for Web (JavaScript)
#1

I’m using Maps SDK for Web 4.47.6.

When I create a marker, and use my own icon, I get it and a default icon - see image.

How to turn off the default icon?

Marker Code:

        const marker1 = tomtom.L.marker(device1Coords, {
           icon: tomtom.L.icon({
                 iconUrl: 'assets/img/mappin-default.png',
                 iconSize: [25, 41],
                 iconAnchor: [17, 70],
                 popupAnchor: [5, -35]
            })
        }).addTo(theMap);

Map Showing Both Icons:

tomtom_iconUrl
tomtom_iconUrl.png1105×427 142 KB

Thanks, Bob

#2

Hi! When you provide an iconUrl it should replace the default marker. That snippet seems to be be fine. Can you double check if you are not adding a second marker?

Please also check this example: https://developer.tomtom.com/maps-sdk-web/functional-examples#custom-markers

If you open it in codepen you can play around with it.

1 Like
#3

Hi E.M.

I checked the code again, and did find the error. I had forgotten to remove the default marker.

Here’s The Code I Removed:

      const markers = new L.TomTomMarkersLayer().addTo(theMap);
      markers.setMarkersData([device1Coords, device2Coords]);
      markers.addMarkers();

Thanks! Bob

1 Like