Viac

Mapa letákov sa načítava nesprávne, keď je vnútri prvku Bootstrap .collapse

Mapa letákov sa načítava nesprávne, keď je vnútri prvku Bootstrap .collapse


Snažím sa vytvoriť mapu letákov, ktorá je pri načítaní stránky skrytá a ktorá sa odhalí, keď používateľ klikne na tlačidlo.

Snažím sa pomocou funkčnosti zbalenia Bootstrap odhaliť mapu po stlačení tlačidla - tu ukážka.

Toto slúži na zobrazenie / skrytie časti mapy - ale formátovanie mapy je prerušené a má veľkú prázdnu oblasť bez údajov:

K tomu dôjde, len keď má div div mapy.kolabovaťtrieda - ak túto triedu odstránite, mapa sa načíta správne.

Otázkou teda je, ako umožniť správnemu načítaniu mapy Leafletu, keď to nie je viditeľné pri načítaní stránky?


https://stackoverflow.com/questions/24412325/resizing-a-leaflet-map-on-container-resize mal odpoveď, ktorá má volať invalidateSize na mape, keď dôjde k udalosti zrútenia:

Skontroluje, či sa zmenila veľkosť kontajnera mapy, a aktualizuje ju, ak je to tak - zavolajte ju po dynamickej zmene veľkosti mapy

$ ('# demo'). on ('shown.bs.collapse', function (e) {map.invalidateSize (true);})

Pozri si video: Bootstrap 4 Accordion with Arrow