Daha çox

Vərəqə nəzarətini yıxın


Xəritəmdəki broşura nəzarətini yıxmaq istəyirəm. Cari kodum var:

var legend = L.control ({mövqe: 'alt', yıxıldı: doğru}); legend.onAdd = function (map) {var div = L.DomUtil.create ('div', 'info legend'); div.innerHTML = "
REDDİ:mətn"; return div;}; legend.addTo (map);

Ancaq hələ də yığıldığını və ya qat qat seçimim kimi hoverdə görünməsini ala bilmirəm. Kodumu necə tənzimləməliyəm? Leaflet nümunələrini ziyarət etdim, ancaq yıxılma xüsusiyyəti yalnız qat elementləri üçündür, sadəcə bir nəzarət üçün deyil.


Mən düşünmürəmçökdü: doğrubu kontekstdə məna verəcəkdir, çünki Leaflet-də qat nəzarətinə bənzəyən bir əfsanə nəzarəti yoxdur (L.control.layers).

Qat nəzarətinə bənzər olaraq, həmişə əfsanə varsayılan olaraq gizlədilmiş, lakin göründüyü zaman div divini gizlətmək üçün yerləşdirilmiş hər zaman varsayılan olaraq göstərilən bir simge ilə div qura bilərsiniz.

Sonra javascript / jQuery ilə hover üzərindəki əfsanəni göstərin:

$ ('# legend-icon-div) .hover (function () {$ (' # legend '). show ();}, function () {$ (' # legend '). hide ();})

Səsdən, Leaflet.EasyButton kömək edə bilər. Vararadan buraxehtiyaclarınıza uyğun tərz edə biləcəyiniz metod (nümunə).

sizin js:

var disclaimer = L.easyButton ('

!!!

', function (btn, map) {alert (' redaktə burada !!! '); }, {mövqe: 'alt sağ'}); disclaimer.addTo (xəritə);

və CSS-də:

.easy-button-button.disabled {display: none; }

sonra istədiyiniz zaman zəng edin:

disclaimer.disable (); // və disclaimer.enable ();

Bu, "onmousenenter" və "onmouseleave" HTML atributlarından istifadə edərək həll oldu:

var legend = L.control ({mövqe: 'alt sağ'}); function showDisclaimer () {var div = document.getElementById ("info legend") div.innerHTML = "
REDDİ:mətn";} function hideDisclaimer () {var div = document.getElementById (" info legend ") div.innerHTML ="VERMƏ";} legend.onAdd = function (map) {var div = L.DomUtil.create ('div', 'info legend'); div.innerHTML ="VERMƏ"; div.setAttribute (" onmouseenter "," showDisclaimer () "); div.setAttribute (" onmouseleave "," hideDisclaimer () "); div.id =" info legend "return div;}; legend.addTo (map );


Videoya baxın: نشرة اخبار الصحف العالمية 21-7 (Oktyabr 2021).