Baselayer / spidol / penanda Google Map tidak terlihat

8

Baru di Leaflet, saat ini mencoba untuk memigrasi proyek dari Google Maps asli ke Leaflet; telah tertarik ke Leaflet oleh manajemen lapisan dan opsi untuk menggunakan peta jalan gaya 'roadmap' yang lebih baik.

Telah mengunduh plugin untuk menggunakan petak Google Map sebagai peta dasar untuk Leaflet, dan berfungsi dengan baik sebagai lapisan dasar.

Namun saya telah menemukan masalah, dan saya tidak cukup berpengalaman dengan Leaflet untuk mengerti mengapa. Saya memiliki spidol yang terlihat dengan lapisan dasar lainnya - tetapi tidak dengan Google. Telah mencoba memaksa Z order tinggi (1000 dll) tetapi tidak ada bedanya. Opacity dari marker penuh 1.0

Marker terlihat di semua lapisan lain (misalnya OSM), ketika saya beralih basis ke Google (satelit atau peta) mereka tidak lagi ditampilkan, tetapi beralih kembali ke basis non-Google dan mereka ada di sana lagi.

Alasan saya mengejar lapisan dasar Google adalah karena Google (sejauh yang saya ketahui) adalah satu-satunya penyedia ubin foto udara yang konsisten dan terperinci untuk wilayah yang saya minati. Ingin menggunakan peta lain tetapi memiliki opsi untuk beralih ke tampilan 'satelit' Google melalui manajer lapisan.

Saat ini menggunakan Leaflet v0.4.5 (tetapi juga telah mencoba v0.4), gejala yang sama terjadi dengan menggunakan browser yang berbeda (IE, FF dll.).

Akan berterima kasih atas bantuannya.

google-maps leaflet markers Dave Martin
sumber

Jawaban:

13

Hanya perbaikan cepat: Anda berada di jalur yang benar dengan indeks-z. Coba tambahkan ini ke file css Anda sendiri (dapat merusak hal-hal lain! Saya hanya membuatnya untuk menampilkan penanda):

.leaflet-map-pane {
    z-index: 2 !important;
}

.leaflet-google-layer {
    z-index: 1 !important;
}
AndyL
sumber
Andy, Terima kasih banyak - yang telah memperbaikinya dengan sempurna dan tidak ada efek samping lain yang dapat saya lihat (setidaknya sejauh ini!). Telah melihat selebaran kode plugin Google Maps dan telah menemukannya menggunakan "insertAtTheBottom" yang saya mengerti sekarang sudah usang. Dave
Dave Martin
0

Telah mengunduh plugin untuk menggunakan petak Google Map sebagai peta dasar untuk Leaflet

Untuk lebih jelasnya, ini melanggar persyaratan layanan Google, jadi lanjutkan dengan hati-hati.

tmcw
sumber
1
Tidak jika dia menggunakan ( psha.org.ru/leaflet/Google.js ) yang saya asumsikan adalah apa yang dia gunakan. Itu ditulis melalui peta api sehingga itu bukan pelanggaran TOS.
AndyL
Tom / Andy, Terima kasih atas komentarnya. Tom - kami masih menggunakan Google Maps "secara asli" untuk peta statis dan di mana saya perlu menampilkan satu situs atau satu jenis situs. Namun, saya mencoba untuk memigrasi bagian yang menunjukkan banyak penanda dari jenis yang berbeda sehingga kita dapat memanfaatkan layer-switching Leaflet (dan juga beralih ke penyedia peta dasar alternatif). Saya minta maaf jika pesan asli saya tidak memperjelas ini, tetapi kami melakukan ini, seperti yang disebutkan Andy, dengan menggunakan plugin Leaflet Google Maps yang pada gilirannya menggunakan Google Maps v3 API - kami tidak mencoba menghubungi ubin langsung. Dave
Dave Martin
0

Beberapa angka lain pada indeks-z, ditampilkan di tempat lain, bekerja pada saya. Posting silang dari sini: https://gist.github.com/crofty/2197042#comment-1234339

.leaflet-google-layer{
    z-index: 0 !important;
}
.leaflet-map-pane{
    z-index: 100;
}

(letakkan ini di CSS atau <style>bagian laman web Anda )

Nikhil VJ
sumber
0

Cobalah untuk memasukkan ini ke css Anda:

.leaflet-google-layer {
    z-index: inherit;
}

Ini membantu saya dalam situasi yang sama

Tanduk
sumber