绘图后将样式附加到要素

时间:2015-01-03 15:31:12

标签: openlayers-3

我正在使用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); 
});

1 个答案:

答案 0 :(得分:6)

您调用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);