как скрыть векторные объекты в openlayers

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


person Andrew Christensen    schedule 29.06.2011    source источник
comment
как насчет того, чтобы пометить вопрос как ответ?   -  person igorti    schedule 08.08.2011


Ответы (7)


Решение

Измените свойство style для OpenLayers.Feature.Vector экземпляров. Установите для атрибута display значение none или для атрибута visibility значение hidden. После этого перерисуйте слой.

Согласно комментариям в OpenLayers код:

display — символизаторы {String} не будут иметь никакого эффекта, если для display установлено значение «none». Все остальные значения не действуют.

Пример кода

Для данной переменной слоя OpenLayers с именем layer вы можете скрыть все функции следующим образом:

var features = layer.features;

for( var i = 0; i < features.length; i++ ) {
  features[i].style = { visibility: 'hidden' };
}

layer.redraw();

Это перебирает все объекты в слое, позволяя полностью контролировать определенные объекты, которые нужно скрыть.

person igorti    schedule 30.06.2011
comment
Да, я только что сделал это, и, к сожалению, вектор не исчез с карты. Я консолью вышла из вектора после установки стиля, и он показывает, что для отображения установлено значение none. Очень расстраивает. Спасибо за помощь! - person Andrew Christensen; 01.07.2011
comment
Упс! igorti, я только сейчас понял, что ты сказал, что я должен перерисовать слой. Дох! Это сделало это! Спасибо!!! - person Andrew Christensen; 01.07.2011
comment
Да, вам нужно будет вызвать redraw() на OpenLayers.Layer.Vector после установки стиля на none. - person Leif Gruenwoldt; 08.08.2011
comment
я бы попытался удалить свойство отображения - удалить стиль [отображение]; а затем перерисовать слой - person igorti; 16.05.2012

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

Скрытие векторных объектов

Я делаю это вручную, устанавливая отображение стиля объекта на none, а затем перерисовывая слой. Если мне нужно снова отобразить функцию, установите для свойства отображения значение block. Довольно просто:

function hideFeatures() {
    var features = layer.features;
    for (var i = 0; i < features.length; i++) {
        var feature = features[i];
        if (!isVisible(feature)) {
            feature.style.display = 'none';
        }
    }
    layer.redraw();
}

Повторное отображение векторных объектов

Повторное отображение скрытых функций немного сложнее в зависимости от вашей ситуации. Взгляните на документацию OpenLayers по стилям, чтобы узнать о некоторых возможностях. Но в целом, если мне нужно снова отобразить функцию, я устанавливаю для атрибута стиля функции значение null. Это гарантирует, что когда средство визуализации OpenLayers выполняет функцию drawFeature, ваши предварительно настроенные стили из styleMap вашего слоя будут перерисованы:

// from OpenLayers drawFeature()
if (!style) {
    style = this.styleMap.createSymbolizer(feature, renderIntent);
}

Таким образом, ваша функция отображения может выглядеть примерно так:

function displayFeatures() {
    var features = layer.features;
    for (var i = 0; i < features.length; i++) {
        var feature = features[i];
        if (isVisible(feature)) {
            feature.style = null; //redraw the feature
        }
    }
    layer.redraw();
}

Другие подходы

Есть еще несколько подходов к этому. Вы можете установить свойства fillOpacity и strokeOpacity равными 0, например:

function displayFeatures() {
    var features = layer.features;
    for (var i = 0; i < features.length; i++) {
        var feature = features[i];
        if (isVisible(feature)) {
            feature.style.fillOpacity = 1;
            feature.style.strokeOpacity = 1;
        }
        else {
            feature.style.fillOpacity = 0;
            feature.style.strokeOpacity = 0;
        }
    }
    layer.redraw();
}

Недостатком этого подхода является то, что любые активные элементы управления картой по-прежнему смогут взаимодействовать со «скрытой» функцией, поэтому, если пользователь случайно щелкнет или наведет курсор на функцию, эти события все равно будут срабатывать.

Вы также можете создать стиль в styleMap вашего слоя, называемый скрытым, с помощью любого из двух описанных выше подходов. Затем, чтобы скрыть функцию, просто измените renderIntent функции на hidden.

Наконец, вы можете добавить подмножества ваших объектов в отдельные слои и вызвать метод слоя setVisibility в false. Это хороший вариант только в том случае, если вам не нужно одновременно взаимодействовать со всеми объектами, поскольку активными будут только элементы управления для верхнего слоя вашей карты. (Существуют способы использования элементов управления для нескольких слоев, но требуется больше жонглирования, и я не рекомендую это без крайней необходимости)

person Kyle    schedule 02.11.2012

Вы можете установить display:none в свойстве стиля. Так что функции не будут отображаться

person SSS    schedule 08.08.2012

Чтобы скрыть функции

    for( var i = 0; i < features.length; i++ ) {
      features[i].style = { display: 'none' };
    }
    layer.redraw();

Чтобы отобразить скрытые функции

    for( var i = 0; i < features.length; i++ ) {
      features[i].style = null;
    }
    layer.redraw();
person Rayiez    schedule 24.07.2013
comment
setVisibility не является свойством ol.layer.Vector - person Steve Staple; 16.03.2017
comment
@SteveStaple Это решение для Openlayers2. - person Rayiez; 28.03.2017

Чтобы скрыть одну функцию

var feature = vectorlayer.getFeatureByFid(fid);
feature.style = { display: 'none' };
vectorLayer.removeFeatures(feature);
vectorLayer.addFeatures(feature);
person Back-Jin Seong    schedule 29.04.2016

Из вашего вопроса неясно, пробовали ли вы это уже, но если нет, вы можете попробовать метод setVisibility().

Ссылка: http://dev.openlayers.org/releases/OpenLayers-2.10/doc/apidocs/files/OpenLayers/Layer-js.html#OpenLayers.Layer.setVisibility

person Howard Y    schedule 30.06.2011
comment
Проблема в том, что я не хочу скрывать весь слой. Я просто хочу скрыть один элемент функции. Есть идеи? - person Andrew Christensen; 01.07.2011

Вот что я, наконец, сделал по этому поводу, поскольку у меня была такая же потребность, но я не хотел скрывать каждую функцию по отдельности или играть со стилем CSS:

Я предполагаю, что у вас где-то есть что-то вроде следующего:

myVector = new OpenLayers.Layer.Vector(...

Затем свяжите этот код с кнопкой или любым другим событием, которое вам нужно:

if( myVector.getVisibility() && myVector.features.length > 0 ) {
      myVector.setVisibility(false);
} else {
      myVector.setVisibility(true);
}

Ссылки на getVisibility() / setVisibility() отсутствуют в векторной части, но есть в документации по слоям.

person Le Droid    schedule 27.02.2014