有没有一种方法可以在传单上动态绘制圆形标记？

<div id="leaflet"></div>

#leaflet {
  width: 500px;
  height: 300px;
  background-image: url('leaflet.jpg');
}

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

$(document).ready(function() {
  // 创建一个圆形标记元素
  var marker = $('<div class="marker"></div>');
  
  // 设置圆形标记的样式
  marker.css({
    width: '20px',
    height: '20px',
    background: 'red',
    borderRadius: '50%',
    position: 'absolute',
    top: '50%',
    left: '50%',
    transform: 'translate(-50%, -50%)'
  });
  
  // 将圆形标记添加到传单容器中
  $('#leaflet').append(marker);
});

.marker {
  animation: rotate 2s linear infinite;
}

@keyframes rotate {
  from {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}