OpenLayers的Vector图层可编辑

对于OpenLayers的Vector图层,上面绘制了各种feature。例如绘制了一个多边形,现在希望通过鼠标来动态调整该feature的边界。

OpenLayers的Interaction提供了这种功能。

ol.interaction.Modify配合ol.interaction.Snap,可以实现feature的动态修改。

创建:

var source = layer.getSource();
var modify = new ol.interaction.Modify({
    source: source
});
map.addInteraction(modify);
var snap = new ol.interaction.Snap({
    source: source
);
map.addInteraction(snap);

可见modify和snap的创建都是基于layer的source,所以尽管Interaction是添加给map的,但仅仅对该layer生效。

map添加了modify和snap的Interaction后,就可以用鼠标对feature进行动态调整了,并且带有吸附效果。

要取消图层可编辑,移除掉对应的Interaction即可:

if(snap) {
    map.removeInteraction(snap);
}
if(modify) {
    map.removeInteraction(modify);
}

注意是对layer生效,一旦开启,对整个layer生效,该layer的所有feature都可进行动态调整。

 

 

你可能感兴趣的:(OpenLayers,OpenLayers,Vector图层,编辑)