OpenLayers меняют цвет функции во время выполнения - PullRequest
0 голосов
/ 30 апреля 2020

Я использую OpenLayers v6.3.1, включая следующую таблицу стилей и скрипт: Scriptfile , Таблица стилей

Цель:

Моя цель - изменить цвет объекта (LineString) во время выполнения, используя javascript.

Настройка:

В основном я использовал код с этого сайта: OpenLayers

var map = new ol.Map({
            target: 'map', //<div id="map"></div>
            layers: [
                new ol.layer.Tile({
                    source: new ol.source.OSM()
                })
            ],
            view: new ol.View({
                projection: 'EPSG:4326',
                center: [11.592581, 47.241524],
                zoom: 15
            })
        });

В этом фрагменте кода Я создаю линию между двумя координатами:

    var lonlat1 = [11.592581, 47.241524];
    var lonlat2 = [11.58554, 47.248958];
    //create the line's style
    var lineStyle = [
        // linestring
        new ol.style.Style({
            stroke: new ol.style.Stroke({
                color: '#000',
                width: 2
            })
        })
    ];

    //create the line       
    var line = new ol.layer.Vector({
        source: new ol.source.Vector({
            features: [
                new ol.Feature({
                    geometry: new ol.geom.LineString([lonlat1, lonlat2])
                })
            ]
        }),
        style: lineStyle
    });
    map.addLayer(line);

, которая дает мне эту карту: Map

Я хочу изменить цвет линии во время выполнения.

То, что я пробовал до сих пор: Я пытался изменить цвет, используя следующий код:

line.style_[0].stroke_.color_ = '#123';

Значение цвета действительно изменилось, но цвет сама линия остается прежней.

1 Ответ

0 голосов
/ 30 апреля 2020

ОК, я понял это. Стиль можно изменить с помощью функции setStyle (), которая является частью линейного объекта.

line.setStyle([
    new ol.style.Style({
        stroke: new ol.style.Stroke({
            color: '#123',
            width: 2
         })
     })
 ]);

Это определенно не лучшее решение, поэтому я открыт для всего лучшего.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...