Předání proměnné do JS – mapa Leaflet
- MikKuba
- Člen | 83
Ahoj,
Našel jsem už několik témat, ale žádné mi nepomohlo. Nový Nette projekt teprve rozjíždím, ale narazil jsem na první problém. Mám zatím jen šablonu @layout.latte, externí JS a presenter. Do šablony je JS nalinkováno a je tam rozpracovaný kód pro Leaflet mapy.
Z databáze budu chtít vytahovat nějaký údaje a vkládat je přímo do externího JS (hlavně GPS koordináty). Jenže – když pomocí jednoduchého řádku v presenteru posílám do šablony proměnnou, do JS souboru ji už nedostanu :/
Presenter:
$this->template->some = 'nějaký text';
Šablona s voláním JS:
{block scripts}
<script src="{$basePath}/js/main.js"></script>
{/block}
A když potom v main.js udělám třeba toto, tak bez úspěchu (funguje pouze když mám JS prasácky přímo v latte šabloně, ne v externím JS):
console.log({$some});
- GEpic
- Člen | 566
Udělej si v globálním namespace javascriptu vlastní objekt, např
window.leaflet = {};
a z toho můžeš v externím
JS číst.
Pokud máš více map, můžeš si takto předávat různá data pro různé mapy – uděláš to např takto (ve své latte šabloně):
<script type="text/javascript">
window.leaflet = {
map1: {$data1},
map2: {$data2}
};
</script>
<script src="{$basePath}/js/main.js"></script>
A v externím souboru budeš mít potom data v tomto objektu
dostupná – je samozřejmě vždy dobré si ověřit, zda-li tam požadovaná
data doopravdy jdou jsou
(window.leaflet.hasOwnProperty("map1")
)
Záleží samozřejmě jaká data máš v proměnné předané do šablony.
Editoval GEpic (6. 8. 2018 21:44)
- GEpic
- Člen | 566
CZechBoY napsal(a):
Nebo si po nacteni data nacist pres ajax. Záleží kolik toho mas a jak dlouho treba trva nacteni.
Tak i tak si musí nějakým způsobem předat link, na kterém provede
ajaxový požadavek, jelikož to chce volat zvenčí.
Pomocí mého řešení si tak může předat pouze link na ajaxový
požadavek.
Ale s leafletem pracuji – kolikrát člověk musí pracovat s vrstvami, přidávat různé markery, trasy, tooltipy a podobně a bohužel idea předávání pouze nějakého strukturovaného JSONu (GeoJSON), který se předá do mapy a ono vše bude fungovat jak má, zde nefunguje vždy tak, jak by člověk potřeboval.
Editoval GEpic (7. 8. 2018 13:06)
- MikKuba
- Člen | 83
GEpic napsal(a):
Udělej si v globálním namespace javascriptu vlastní objekt, např
window.leaflet = {};
a z toho můžeš v externím JS číst.Pokud máš více map, můžeš si takto předávat různá data pro různé mapy – uděláš to např takto (ve své latte šabloně):
<script type="text/javascript"> window.leaflet = { map1: {$data1}, map2: {$data2} }; </script> <script src="{$basePath}/js/main.js"></script>
A v externím souboru budeš mít potom data v tomto objektu dostupná – je samozřejmě vždy dobré si ověřit, zda-li tam požadovaná data doopravdy jdou jsou (
window.leaflet.hasOwnProperty("map1")
)Záleží samozřejmě jaká data máš v proměnné předané do šablony.
Moc díky, toto mi pomohlo a není to nijak složitý :) Je to sice takový punkový, ale v tuto chvíli asi nejlepší, abych taky věci z dokumentace Leafletu mohl rovnou používat v daném JS :)