Leaflet: Cambiar icono de marcador

Cambiar el icono de marcador que usa por defecto Leaflet es muy sencillo si usamos el objecto L.Icon.

Algunos de los parámetros que podemos personalizar son:

• iconUrl: sería la ruta de la nueva imagen o icono
• shadowUrl: sería la ruta de la imagen para la sombra del marcador
• iconSize: el tamaño del icono
• shadowSize: el tamaño de la sombre
• iconAnchor: punto del icono que correspondería a la ubicación del marcador.
• shadowAnchor: punto del icono de la sombra que correspondería a la ubicación del marcador.
• popupAnchor: punto desde el cual se abrirá el popup en relación con el nuevo icono

A continuación un ejemplo básico en el que modificaremos la imagen icono del marcador por otro personalizado:

var lat = '42.603';
var lng = '-5.577';
var zoom = 10;

var map = L.map('map').setView([lat, lng], zoom);

L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

var customIcon = new L.Icon({
  iconUrl: 'https://image.flaticon.com/icons/svg/854/854866.svg',
  iconSize: [50, 50],
  iconAnchor: [25, 50]
});

L.marker([lat, lng], {icon: customIcon}).addTo(map);

Demo: