Question

我正在使用ol.interaction.Draw方法在地图上绘制多边形。

•我不希望用户能够绘制太大或与自身相交的多边形，因此当满足其中任何一个条件时（我已经编写了代码来确定），我希望我的多边形线从默认的蓝色变为红色，以便用户知道它们的多边形是不可接受的。

•我知道如何为Draw功能设置原始样式，但无法在用户仍在绘图的情况下确定动态更改动态的样式。

非常感谢任何帮助。谢谢！

Answer 1

ol.layer.Vector和ol.interaction.Draw的style参数可以是StyleFunction，它接收要素和当前地图分辨率。如果几何图形有效并且返回适当的样式，则可以签入此函数。

这是一个示例，如果几何体具有多于2个坐标，则颜色从绿色变为红色：

var drawStyle = function(feature, resolution) {
    var color = 'green';
    if(feature.getGeometry().getCoordinates().length > 2) {
        color = 'red';
    }
    return [new ol.style.Style({
        stroke: new ol.style.Stroke({
            color: color,
            width: 2
        }),
        ...
    })];
};

var draw = new ol.interaction.Draw({
    ...
    style: drawStyle
});

http://jsfiddle.net/sad71377/

在openlayers 3中动态更改矢量样式

1 个答案: