Sign in to follow this  
jarekcda

Punkt na mapie- skrypt java- proszę o pomoc

Recommended Posts

Panowie proszę o pomoc. Znam php, ale nie ogarniam skryptów. Mam skrypt oznaczający punkt na mapie po wpisaniu w formularz nazwy miasta np Warszawa. Chciałbym go przerobić, żeby wpisało miasto ze zmiennej ze skryptu php (strona w php)

To jest wklejone również na     pastebin.com/4Sc1ZHDn


<div id="map"></div>
<form>
<input type="text" />
<button type="submit">Znajdź</button>
</form>

<script>
const map = new L.Map(document.getElementById("map"));
const tilesUrl = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png";
const mapAttrib =
'Map data _ <a href="https://openstreetmap.org">OpenStreetMap</a> contributors. Data _ OpenStreetMap contributors, ODbL 1.0. <a href="https://openstreetmap.org/copyright">Copyright</a>.';

const layer = new L.TileLayer(tilesUrl, {
minZoom: 8,
maxZoom: 20,
attribution: mapAttrib
});

const center = new L.LatLng(51.745835, 19.461556);
map.setView(center, 15);
const marker = L.marker(center);
marker.addTo(map);
map.addLayer(layer);

document.querySelector("form").addEventListener("submit", function(e) {
e.preventDefault();
const query = this.querySelector("input").value;
fetch(
`https://nominatim.openstreetmap.org/search…
)
.then(resp => resp.json())
.then(resp => {
if (resp.length > 0) {
const center = new L.LatLng(resp[0].lat, resp[0].lon);
map.setView(center, 15);
marker.setLatLng(center);
}
});
});
</script>


Dodaj własny artykuł na naszym blogu   http://bazafirmy.pl/blog/     , http://ikatalogfirm.pl/blog/    , http://katalogifirm.com.pl/blog/

Share this post


Link to post
Share on other sites
2 minuty temu, jarekcda napisał:

Znam php, ale nie ogarniam skryptów.

:crazy:

 

Stosuj formatowanie w znacznikach <code>

5 minut temu, jarekcda napisał:

Chciałbym go przerobić, żeby wpisało miasto ze zmiennej ze skryptu php

Nie mam pojęcia o co chodzi


:zdziwko: A.D. Kingdom and Empire

HTTP 200 usługi IT - Dariusz Janicki | Realizacja serwisów www oraz oprogramowania w PHP / C# / Node.js / MySQL :chatownik:

Share this post


Link to post
Share on other sites

Jak do tej części dodać zmienną z php (żeby działało)?

document.querySelector("form").addEventListener("submit", function(e) {
        e.preventDefault();
        const query = this.querySelector("input").value;
        fetch(.......

Próbowałem

const query = <?php echo $_POST['dane']; ?>;

nie działa.

 


Dodaj własny artykuł na naszym blogu   http://bazafirmy.pl/blog/     , http://ikatalogfirm.pl/blog/    , http://katalogifirm.com.pl/blog/

Share this post


Link to post
Share on other sites
Posted (edited)
4 minuty temu, jarekcda napisał:

const query = <?php echo $_POST['dane']; ?>;

By działało plik "strona" musi być w PHP. Zobacz co wyświetla tablica 

<?php print_r( $_POST);?>

Jeśli juz coś wyświetla i to od user , to przydało by się to filtrować

https://www.php.net/htmlspecialchars

 

Edited by Mion

:zdziwko: A.D. Kingdom and Empire

HTTP 200 usługi IT - Dariusz Janicki | Realizacja serwisów www oraz oprogramowania w PHP / C# / Node.js / MySQL :chatownik:

Share this post


Link to post
Share on other sites
Posted (edited)

Ale jak to ma według Ciebie wyszukiwać ? Przecież leaflet nie ma tej funkcji.

Jedynie w pluginach do wyszukiwania lokalizacji https://leafletjs.com/plugins.html

---------

Ale teraz wyszukiwanie Ci działa :) Szuka miasta np: Poznań

---

Z tym, ze 1:1 to jest za mało,  bo cała masa nazw miast jest zdublowana, więc musiał byś wprowadzić województwo, powiat lub po wyszukaniu pokazać więcej niż 1 marker

Edited by Mion

:zdziwko: A.D. Kingdom and Empire

HTTP 200 usługi IT - Dariusz Janicki | Realizacja serwisów www oraz oprogramowania w PHP / C# / Node.js / MySQL :chatownik:

Share this post


Link to post
Share on other sites
Posted (edited)

Tu skrypt pobiera dane z formularza:
 

e.preventDefault();
const query = this.querySelector("input").value;
 fetch(
 `https://nominatim.openstreetmap.org/search?format=json&q=${query}`

I to idzie AJAXEM zobacz co za re questy idą np:

https://nominatim.openstreetmap.org/search?format=json&q=Poznań

Nie rozumiem czego w tym nie rozumiesz.  Musisz obsłużyć stosowne zdarzenie itd...

----------

document.querySelector("form").addEventListener("submit", function(e) {

Powyżej przechwytujesz zdarzenie wysłania formularza co pobiera do zmiennej dane z imputa.
Wiec użyj zdarzenia

https://developer.mozilla.org/en-US/docs/Web/API/Window/load_event

przy wczytywaniu strony

 

 

 

Edited by Mion

:zdziwko: A.D. Kingdom and Empire

HTTP 200 usługi IT - Dariusz Janicki | Realizacja serwisów www oraz oprogramowania w PHP / C# / Node.js / MySQL :chatownik:

Share this post


Link to post
Share on other sites

Litości! Ale co tam nie działała? Gdzie ma się wyświetlać miasto ? Pisz jakoś konkretniej, a nie lakonicznie, że trzeba się domyślać.
Ponoć znasz PHP

 

Może ktoś inny będzie CI wstanie pomoc, bo ja już rezygnuje.


:zdziwko: A.D. Kingdom and Empire

HTTP 200 usługi IT - Dariusz Janicki | Realizacja serwisów www oraz oprogramowania w PHP / C# / Node.js / MySQL :chatownik:

Share this post


Link to post
Share on other sites

Chciałem mapę podłączyć do katalogu firm, żeby wyświetlało położenie firmy. Ale nie z formularza pod mapą, ale ze skryptu- strona się otwiera i jest od razu pokazane jej położenie.

Ale dziękuję za pomoc.


Dodaj własny artykuł na naszym blogu   http://bazafirmy.pl/blog/     , http://ikatalogfirm.pl/blog/    , http://katalogifirm.com.pl/blog/

Share this post


Link to post
Share on other sites
TU musisz wypisać miasto za pomocą PHP :

`https://nominatim.openstreetmap.org/search?format=json&q=<?php echo $miasto;?>`

Następnie w zdarzeniu wczytania strony wykonać kod skryptu, który AJAXEM odpyta  i wynik JSON przekaże do funkcji od mapy czyli dokładnie to co się dziele prz przechwyceniu zdarzenia wysłania formularza.

https://developer.mozilla.org/en-US/docs/Web/API/Window/load_event

 

Poza tym taka obsługa pozmieniania miasta jest do DU*Y, bo jest niejednoznaczna. Pobieraj dane od userów w postaci  Get Latitude and Longitude

 


:zdziwko: A.D. Kingdom and Empire

HTTP 200 usługi IT - Dariusz Janicki | Realizacja serwisów www oraz oprogramowania w PHP / C# / Node.js / MySQL :chatownik:

Share this post


Link to post
Share on other sites

Ciekawe bo "Mi działa" http://www.http200.pl/chwilowy/mapa2.php

Oczywiscie tak na pordukcji  być nie możne, bo mapa jest dwa razy wgrywane, ale jest to ma mega szybko przykład.


:zdziwko: A.D. Kingdom and Empire

HTTP 200 usługi IT - Dariusz Janicki | Realizacja serwisów www oraz oprogramowania w PHP / C# / Node.js / MySQL :chatownik:

Share this post


Link to post
Share on other sites
1 godzinę temu, Mion napisał:

Może ktoś inny będzie CI wstanie pomoc, bo ja już rezygnuje.

95% potrzebujących nie potrafi wyartykułować o co im chodzi a potem im nie działa, ode mnie szacun za dobre chęci :)

  • Like 2
  • Thanks 1

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   1 member