Bagaimana cara mengubah urutan peletakan panel Leaflet Map (z-index)?


16

Leaflet menyatakan bahwa elemen panel Peta berisi semua lapisan yang ditambahkan ke peta. Perbedaan antara banyak panel Peta adalah urutan z-indeks layering.

Saya ingin menggunakan kombinasi lapisan lvector.CartoDB, yang pada dasarnya adalah overlayPanelapisan, dengan TileLayer, seperti GeoIQ Acetate-bg dan label.

Ini adalah pengurutan elemen saat ditambahkan peta:

tileLayer1 = new L.TileLayer();
map.add(tileLayer1);  // add first layer to map

cartoDBLayer1 = new lvector.CartoDB();
cartoDBLayer.setMap(map); // add second layer to map

tileLayer2 = new L.TileLayer();
map.add(tileLayer2);  // add third layer to map

Apa yang dikembalikan adalah peta dengan lapisan dalam urutan ini:

tileLayer1,tileLayer2,cartoDBLayer1

tileLayer1dan tileLayer2terletak di HTMLElement: TilePanedan cartoDBLayer1di HTMLElement: overlayPane.

Apakah ada cara untuk memaksa cartoDBLayer1membuat di TilePane, sehingga jatuh dalam urutan indeks-z yang ditambahkan ke peta di ...

yaitu

z-index[0]:tileLayer1
z-index[1]:cartoDBLayer1
z-index[2]:tileLayer2 

Jawaban:


17

Pernahkah Anda melihat masalah ini membuat satu repo LeafLet github:

https://github.com/Leaflet/Leaflet/issues/167

coba gunakan

 addLayer(layer,true);

untuk menambahkan lapisan ubin ke bagian bawah. Saya khawatir hanya itu yang ada dan argumen opsional kedua ini bahkan tidak didokumentasikan.

Perbarui September 2014

Leaflet sekarang mendukung pengaturan zIndex . Terima kasih kepada @knutole di komentar karena memberi tahu saya.


1
+1 untuk menyebutkan fitur tidak berdokumen di sini, sehingga mendokumentasikannya. :)
fgysin mengembalikan Monica

7
Sekarang ada layer.setZIndex(zIndex)fungsi yang tersedia.
knutole

5
Terima kasih - layer.setZIndex(99)sepertinya tidak berfungsi untuk saya dengan simbologi vektor (fitur garis dan poligon), tetapi menggunakan layer.bringToFront()triknya.
nothingisnecessary
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.