Как изменить цвет объекта в openlayers?

11

Я загружаю файл geojson в openlayers, чтобы показать несколько полигонов. Из этого файла я также создаю список всех имен этих полигонов.

Теперь я хочу изменить цвет многоугольника при выборе из списка (щелкнул по названию).

Я пытался создать стиль ( http://docs.openlayers.org/library/feature_styling.html ), но я не смог выяснить, как добавить этот стиль в полигон. Как я могу это сделать?

openlayers-2

— jlai79
источник

7

Вы можете просто создать хэш-набор символов стиля и назначить его выбранному полигону перед добавлением его в слой:

var selected_polygon_style = {
    strokeWidth: 5,
    strokeColor: '#ff0000'
    // add more styling key/value pairs as your need
};

selectedFeature.style = selected_polygon_style;
layer.addFeatures([selectedFeature]);

На этой странице ( http://docs.openlayers.org/library/feature_styling.html ) вы можете найти много информации о свойствах стиля, которые вы можете изменить:

Цвет заливки
fillOpacity
strokeColor
strokeOpacity
strokeWidth
strokeLinecap
strokeDashstyle
...

— mfdev
источник

9

Но что, если он уже на слое? Я нашел это решение: mylayer.drawFeature (mylayer.getFeatureById (id), {fillColor: "# 00ffff", strokeColor: "# 00ffff"});

— jlai79

да, вы правы, вы просто перерисовываете это с новым стилем.

— mfdev

2

Использование дела в другом ответе.

Просто изменив использование "setStyle ()"

Этот случай сработал для меня.

var selected_polygon_style = {
    strokeWidth: 5,
    strokeColor: '#ff0000'
    // add more styling key/value pairs as your need
};

selectedFeature.setStyle(selected_polygon_style);
layer.addFeatures([selectedFeature]);

— Хорхе Роча
источник

Это не сработало для меня, я получил «Uncaught TypeError: feature.setStyle не является функцией»

— Мэтью Лок

1

Whit OpenLayers 4.6.5 для изменения цвета я использую это:

myLayer.getSource().getFeatures()[1].setStyle(new ol.style.Style({
      image: new ol.style.Icon(/** @type {module:ol/style/Icon~Options} */({ // /** @type {olx.style.IconOptions} */
        color: '#00ffff', //  #FF0000
        crossOrigin: 'anonymous',
        src: '/img/dot.png'
      }))
    }));

getFeatures()[1]является одним из элементов моей функции. Если бы я изменил ВСЕ функции, я бы использовал цикл.

— Антонио Файенца
источник