openlayers3：在vectorContext.setStyle ol.style.Icon 不能工作？

Question

这个例子展示了如何使用 postcompose 和 vectorContext 为特征设置动画：

http://openlayers.org/en/latest/examples/feature-animation.html

我尝试替换这些行中的样式：

var style = new ol.style.Style({
    image: new ol.style.Circle({
        radius: radius,
        snapToPixel: false,
        stroke: new ol.style.Stroke({
            color: 'rgba(255, 0, 0, ' + opacity + ')',
            width: 0.25 + opacity
        })
    })
});

vectorContext.setStyle(style);

当我将样式替换为 img 样式时，如下所示：

var style = new ol.style.Style({
    image: new ol.style.Icon(({
        src: 'https://openlayers.org/en/v3.20.1/examples/data/icon.png'
    }))
});

它不起作用并引发错误：无法读取 null 的属性“0”

这是一个错误吗？或者我该如何使用img样式呢？

Answer 1

如果要添加图像而不是普通的Point，则无需将样式更改为animate函数。

您可以通过这种方式将所需的样式添加到矢量图层中：

var vector = new ol.layer.Vector({
    source: source,
    style: new ol.style.Style({
        image: new ol.style.Icon(({
            src: 'https://openlayers.org/en/v3.20.1/examples/data/icon.png'
        }))
    })
});

我编辑了您的 jsfiddle，但没有为 vectorContext 设置任何样式。如果你想获得一些动画，比如在 Openlayers 站点示例中，你只需要通过在 jsfiddle 代码中取消注释来添加旧样式。