openlayers地图添加的图标实现旋转动画

要实现旋转动画，可以使用CSS3中的动画属性。以下是一个实现旋转动画的例子：

首先，在添加图标时，要设置一个CSS类名，例如"rotate-marker"：

var iconStyle = new ol.style.Style({
    image: new ol.style.Icon({
        src: 'path/to/icon.png',
        className: 'rotate-marker'
    })
});

var marker = new ol.Feature({
    geometry: new ol.geom.Point([lon, lat])
});

marker.setStyle(iconStyle);

vectorSource.addFeature(marker);

然后，在CSS文件中定义"rotate-marker"类的动画效果：

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

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

这个动画会让图标以线性的速度在2秒内从0度旋转到360度，然后无限循环。

注意：如果您使用的是OpenLayers 2.x，请使用旧版的样式设置方法，而不是使用CSS类名。可以参考官方文档中的例子：http://openlayers.org/en/v2.13.1/examples/vector-features-with-text.html