Get started with leaflet.AnimatedMarker CDN

// Include required libraries
L.Icon.Default.imagePath = 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.7.1/images/';
const AnimatedMarker = L.AnimatedMarker.icon;

// Initialize a map in the "mapid" element
const map = L.map('mapid').setView([51.505, -0.09], 13);

// Create a marker icon with an animation
const iconAnimation = new AnimatedMarker({
  iconUrl: 'marker.png',
  iconRetinaUrl: 'marker-2x.png',
  shadowUrl: 'marker-shadow.png',
  iconSize: [38, 95],
  shadowSize: [68, 95],
  animateOnAdd: false,
  frameRate: 20, // frames per second
  frames: [
    { duration: 100, opacity: 1 },
    { duration: 100, opacity: 0 }
  ]
});

// Create a marker with the animated icon
const marker = new L.Marker(map.getCenter(), { icon: iconAnimation });
marker.addTo(map);

// Animate the marker on the map
marker.on('add', function() {
  this.startAnimating();
});