在我的网页上,用户可以绘制一个多边形,然后对其进行修改。但是,我只允许用户拖放绘制的角,而不是在修改多边形时将新点添加到多边形中。
在下面的示例中,我创建了一个具有四个角的多边形,并希望在修改过程中保持四个角(仅拖动角)。
我认为我们应该在condition
函数中使用modify
,但是不确定如何找出单击多边形的角或边之间的区别。
<!DOCTYPE html>
<html>
<head>
<title>Draw Features</title>
<link rel="stylesheet" href="https://openlayers.org/en/v5.3.0/css/ol.css" type="text/css">
<script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>
</head>
<body>
<div id="map" class="map"></div>
<script>
var raster = new ol.layer.Tile({
source: new ol.source.OSM()
});
var source = new ol.source.Vector({wrapX: false});
var offset = 1000000;
var ply = new ol.geom.Polygon([[
[-11000000 - offset, 4600000 - offset],
[-11000000 + offset, 4600000 - offset],
[-11000000 + offset, 4600000 + offset],
[-11000000 - offset, 4600000 + offset]]]);
var feature = new ol.Feature(ply);
source.addFeatures([feature]);
var vector = new ol.layer.Vector({
source: source
});
var map = new ol.Map({
layers: [raster, vector],
target: 'map',
view: new ol.View({
center: [-11000000, 4600000],
zoom: 4
})
});
var modify = new ol.interaction.Modify({source: source})
map.addInteraction(modify);
</script>
</body>
</html>
答案 0 :(得分:2)
var modify = new ol.interaction.Modify({
source: source,
insertVertexCondition: ol.events.condition.never
});