绘图后将样式附加到要素

Question

我ol.Interaction.Draw用来在地图上绘制多边形.我希望在绘制后为各个特征设置样式.

当我检测到一个DRAWEND事件时,我尝试将一个样式附加到最后绘制的特征,但是只有一般的图层样式出现在屏幕上,虽然我在通过调试器搜索特征本身时看到它.

map.addInteraction( drawInter = new ol.interaction.Draw({           
                features: drawLayer.getFeatures(),                      
                type: "Polygon" 
                })                                                  
            );

drawInter.on('drawend', function(e) {                           
    var style = new ol.style.Style({                                    
        fill: new ol.style.Fill({ color: newColor })
        });

    var features = drawLayer.getFeatures().getArray();                  
    var last = features.length-1;
    features[last].setStyle(style); 
});

Answer 1

您调用的功能setStyle不是刚刚绘制的功能.这就是为什么刚刚绘制的功能没有预期的样式.(并且考虑到你的代码,我很惊讶当绘图完成时,该功能在地图上仍然存在.)

您的代码在多种方面不正确/奇怪:

• 读取代码听起来就像你认为getFeatures向量层上的每次调用都返回相同的数组.事实并非如此.每次调用getFeatures实际返回一个新数组.

• 您将一系列要素传递给Draw交互(通过该features选项).这是不正确的.该features选项应该的ol.Collection.

• 在drawend回调中,事件对象(e在您的代码中)包含对绘制的特征(e.feature)的引用.

因此,如果要将绘制的要素保留在矢量图层中,可以使用以下命令:

var draw = new ol.interaction.Draw({
  type: 'Polygon',
  source: drawLayer.getSource()
});

draw.on('drawend', function(e) {
  var style = new ol.style.Style({
    // ...
  });
  e.feature.setStyle(style);
});

map.addInteraction(draw);