Javascript 从OpenLayers中的GeoJSON属性设置源图标

我正试图从一个GeoJSON文件构建一个带有OpenLayers的地图，其中每个点都有一个属性iconUrl。我希望我的风格是指那个属性，但我无法做到这一点。我是用传单做的，你可以在这里看到目标：

这是我的OL代码：

function styleFunction(feature) {
  if (feature.get('iconUrl')) {
    var iconUrl = feature.get('iconUrl');
    console.log(iconUrl);
  }
  var defaultStyle = new ol.style.Style({
   fill: new ol.style.Fill({
    color: "green"
  }),
  stroke: new ol.style.Stroke({
   color: "green",
   width: 1.2
  }),
  image: new ol.style.Icon({
   scale: 0.1,
   src: iconUrl
  })
 })return [defaultStyle]
}

以及：

我得到的错误是“断言失败：6=>必须提供已定义且非空的src或映像。” 我尝试了几种选择，但没有成功。 我的console.log告诉我feature.get（）工作正常，我的URL在var iconUrl中。

---

有什么线索吗？

因为你也有填充和笔划，你的风格也用于多边形吗？如果其他功能没有iconUrl，则会导致错误。尝试修改样式功能，以便仅当存在

iconUrl

function styleFunction(feature) {
  var iconUrl = feature.get('iconUrl');
  var defaultStyle = new ol.style.Style({
    fill: new ol.style.Fill({
    color: "green"
  }),
  stroke: new ol.style.Stroke({
   color: "green",
   width: 1.2
  }),
  image: iconUrl ? new ol.style.Icon({
   scale: 0.1,
   src: iconUrl
  }) : undefined
 });
 return [defaultStyle];
}

---

是的，这就是问题所在，谢谢！一位朋友在我贴到这里几分钟后帮我解决了这个问题，他使用了另一个函数和一个if，但你的解决方案要简单得多！我认为该图像仅用于点，所以OL不会尝试将其应用于线串和多边形特征。

function styleFunction(feature) {
  var iconUrl = feature.get('iconUrl');
  var defaultStyle = new ol.style.Style({
    fill: new ol.style.Fill({
    color: "green"
  }),
  stroke: new ol.style.Stroke({
   color: "green",
   width: 1.2
  }),
  image: iconUrl ? new ol.style.Icon({
   scale: 0.1,
   src: iconUrl
  }) : undefined
 });
 return [defaultStyle];
}