Openlayers在一层上有不同的颜色形状？答案

【问题标题】：Openlayers different colour shapes on one layer?Openlayers在一层上有不同的颜色形状？
【发布时间】：2019-01-06 20:33:31
【问题描述】：

所以我编写了代码来允许我向地图添加形状，并且绘制函数看起来像这样

  addInteraction() {
    this.coreMap.map.addInteraction(this.modifyLayer);
    this.draw = new Draw({
      source: this.vectorSource,
      style: this.style,
      type: 'Point'
    });
    this.coreMap.map.addInteraction(this.draw);
    this.snap = new Snap({source: this.vectorSource});
    this.coreMap.map.addInteraction(this.snap);
  }

效果很好，让我可以在地图等上绘制，但是如果我尝试将 vectorLayer 上的样式更改为让我们说从绿色点变为红色点，它会将每个点变为红色而不是新点，我已经尝试了几件事；

尝试使用 setStyle([styleOneOpts, styleTwoOpts]) 将新样式对象推入 vectorLayer.styles
将 Draw 属性的 style 属性设置为不同的值，这会将光标更改为所述颜色，但绘制的点仍将是 vectorLayers 样式颜色
尝试创建一个新的 Draw 对象并将其作为全新的交互添加到地图中

目前我假设每次我想创建一个具有不同颜色的新形状时都必须创建一个新图层，如果没有办法绕过它很好，但希望它留在里面一层。

【问题讨论】：

标签： angular openlayers

【解决方案1】：

您可以为每个新创建的要素设置样式，或者为每个要素设置颜色属性，例如feature.set('color', 'red'); 并为图层使用样式函数。这将使用功能上设置的颜色，如果没有设置，则默认为黑色

style: function(feature) {
  return new Style({

    ...

      color: feature.get('color') || 'black',

   ...

  })
}

【讨论】：