Как определить порядок слоев в Openlayers?


28

У меня есть маркерный слой, два векторных слоя и два растровых слоя. Слой маркера покрывается двумя растровыми слоями.

Есть ли способ перемещать маркерный слой всегда сверху?

Отредактировано: порядок Z-индексов хорошо работает в векторном слое, но когда я добавляю другой растровый слой WMS на карту с более низким Z-индексом, растровый слой по-прежнему покрывает векторный слой.

Отредактировано: Может ли кто-нибудь указать на разницу порядка рендеринга в терминах «LayerIndex» и «Z-Index» слоя? Я думаю, что индекс слоя имеет дело с порядком наложения, а Zindex имеет дело с порядком объектов в векторном слое, я прав?


Я думаю, что layerindex и z-index являются взаимозаменяемыми терминами в OpenLayers. Они используются в том же контексте в документации, например: dev.openlayers.org/releases/OpenLayers-2.11/doc/apidocs/files/…
Кейси,

Привет @Casey Я ценю твой пример. Тем не менее, я не думаю, что layerindex и z-index являются взаимозаменяемыми. По моему опыту setZindex не работает, но setIndex работает. Я заметил, что: 1. Пример Z-index в openlayer работает для объекта в векторном слое, и он включается с помощью rendererOptions: {zIndexing: true}. 2.В вашем примере для слоя растрового изображения вы можете видеть, что порядок рендеринга слоя основан на том, что вы видите в элементе управления карты, который зависит от индекса слоя (как ваш код ответа). 3. Индекс слоя устанавливается в порядке, который я добавляю на новом слое (на основе слоя как 0 ...)
видно

1. Я думаю, что вы правы. 2 и 3. Правильно, но вы можете переопределить поведение по умолчанию, вызвав метод setLayerIndex, который корректирует z-индекс слоя. Это повлияет на порядок слоев в элементе управления картой и порядок рисования слоев.
Кейси

Ответы:


24

Установка z-index для каждого слоя должна помочь: http://www.openlayers.org/dev/examples/ordering.html

отредактированный

Пример, на который я изначально ссылался, не слишком полезен. Вы хотите установить индекс слоя / z-index для слоев, а не создателей внутри слоев (как показано в примере упорядочения). Я собрал пример (основанный на этом примере ), показывающий пользовательскую индексацию слоя. Обратите внимание, что когда вы включаете растр Canada Raster, слой Marker остается сверху.

Вот соответствующий код:

map.setLayerIndex(dm_wms, 0); //set the image overlay to the bottom
map.setLayerIndex(markers, 99); //set the marker layer to an arbitrarily high layer index

Документация для кода setLayerIndex находится здесь: http://dev.openlayers.org/releases/OpenLayers-2.11/doc/apidocs/files/OpenLayers/Map-js.html#OpenLayers.Map.setLayerIndex


пример ссылки на вредоносное ПО.
Bazinga777

8

Вы можете сделать это, если хотите, чтобы ваш векторный слой всегда был сверху с простым кодом ...

var vecLyr = map.getLayersByName('VectorLayer')[0];
map.raiseLayer(vecLyr, map.layers.length);

Пусть это будет легко!


4

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

myMarkerLayer.setZIndex (1001);


Это был единственный ответ, который работал для меня тоже. Ни один из других не работал.
Мэтью Лок

3

Вы можете подумать о добавлении слоя на карту, как о том, чтобы положить новый лист поверх существующих. Если новый лист не прозрачен, он скроет все нижеуказанные.

К сожалению, OpenLayers не имеет метода insertLayerAt , поэтому вам нужно изменить порядок слоев после вставки. Решение состоит в том, чтобы добавить слой и затем переместить его вниз по стеку на желаемую глубину или переместить тот, который вы хотите, сверху вниз на вершину.

Вы можете сделать это следующим образом:

// add your wms as usual
var yourWMSLayer = new ....
map.addLayer(yourWMSlayer);

// you can do it both ways:
// 1. now move the markers to the top of the stack
var yourMarkers = map.getLayersByName("the marker layer name")[0];
map.setLayerIndex(yourMarkers, map.layers.length-1);

// 2. OR you move the WMS down
// this is more succint
map.setLayerIndex(yourWMSLayer, map.layers.length-2);
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.