Динамическое изменение стиля вектора в openlayers 3

Question

Я использую метод ol.interaction.Draw для рисования многоугольника на карте.

• Я не хочу, чтобы пользователь мог рисовать многоугольник, который является слишком большим или пересекается, поэтому, когда выполняется любое из этих условий (которое я уже написал для определения кода), я хочу линии моего полигона, чтобы изменить синий цвет по умолчанию на красный, чтобы пользователь знал, что их многоугольник неприемлем.

• Я знаю, как установить стиль первоначально для функциональности Draw, но не могу понять, получения стиля для динамического изменения на лету, в то время как пользователь продолжает рисовать.

Любая помощь была бы принята с благодарностью. Благодаря!

Answer 1

style аргумент ol.layer.Vector а также ol.interaction.Draw может быть 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/