Question

我试图在用ol.interaction.Draw绘制多边形之后使其可编辑。
当我实例化ol.interaction.Modify时，我得到一个＆＃34; b.attachEvent不是一个函数＆＃34 ;错误。
这是代码：

drawPolygon.on("drawend",function(p)
{
    setTimeout(function()
    {
        modifyPoligon = new ol.interaction.Modify({
            features: vectorSource.getFeatures()
        });
    },200);
}

我也使用超时，因为在drawend调用中，Feature仍然不在图层中，是否有更好的方法在绘制特征后在图层上获得回调？

Answer 1

不确定是否适合您的情况，但这里采用了类似的方法：https://jsfiddle.net/ko822xjw/

// Create a draw interaction and add it to the map:
drawInteraction = new ol.interaction.Draw({ source:vectorSource, type:"Polygon" });
map.addInteraction(drawInteraction);
// set listener on "drawend":
drawInteraction.on('drawend', function(e) {
  // get drawn feature:
  var feature = e.feature;
  // remove draw interaction:
  map.removeInteraction(drawInteraction);
  // Create a select interaction and add it to the map:
  selectInteraction = new ol.interaction.Select();
  map.addInteraction(selectInteraction);
  // select feature:
  selectInteraction.getFeatures().push(feature);
  // do something after drawing (e.g. saving):
  // ...
  // Create a modify interaction and add to the map:
  modifyInteraction = new ol.interaction.Modify({ features: selectInteraction.getFeatures() });
  map.addInteraction(modifyInteraction);
  // set listener on "modifyend":
  modifyInteraction.on('modifyend', function(evt) {
    // get features:
    var collection = evt.features;
    // There's only one feature, so get the first and only one:
    var featureClone = collection.item(0).clone();        
    // do something after modifying (e.g. saving):
    // ...
  });        
});

Answer 2

可能很简单：

var
    features = new ol.Collection(),
    modify = new ol.interaction.Modify({
        features: features
    }),
    vectorSource = new ol.source.Vector({
        features: features
    }),
    vectorLayer = new ol.layer.Vector({
        source: vectorSource
    }),
    map = new ol.Map({
        layers: [
            new ol.layer.Tile({
                source: new ol.source.MapQuest({layer: 'osm'})
            }),
            vectorLayer
        ],
        target: 'map',
        view: new ol.View({
            center: [0, 0],
            zoom: 2
        })
    }),
    drawPolygon = new ol.interaction.Draw({
        features: features,
        type: 'Polygon'
    })
;
map.addInteraction(modify);
map.addInteraction(drawPolygon);

http://jsfiddle.net/jonataswalker/r2g1atty/

Openlayers 3 - 绘制后修改多边形

2 个答案: