如何在Leaflet闪烁中制作标记

是否有一种简单的方法可以使Leaflet地图中的标记闪烁？我的意思是动画闪烁 - 类似于从不透明度1.0到1秒内不透明度0.5然后反转,循环结束的过渡循环.

添加a时,Marker您可以指定Icon- 包含a的选项className.您可以使用此className选项通过CSS为标记的图标设置动画.

var map = L.map('map').setView([51.505, -0.09], 13);

L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  attribution: 'Map data © OpenStreetMap contributors',
  maxZoom: 18
}).addTo(map);

L.marker([51.5, -0.09], {
  icon: L.icon({
    iconUrl: 'https://unpkg.com/leaflet@1.0.3/dist/images/marker-icon.png',
    className: 'blinking'
  })
}).addTo(map);

#map {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

@keyframes fade { 
  from { opacity: 0.5; } 
}

.blinking {
  animation: fade 1s infinite alternate;
}