Ciao a tutti.
Poichè mi sto divertendo a pianificare un viaggio con un DB per organizzare tappe e info varie, tra le informazioni che registro ci sono anche le coordinate GPS dei vari posti / P.O.I.
Sarebbe stato carino visualizzarli su una mappa (google maps), quindi ho cominciato a cercare in rete e mi sono imbattuto in un tutorial (in italiano…) sull'uso della libreria free Leaflet e le mappe di OpenStreetMap.
Tuttavia sto incontrando un pò di difficoltà, più che altro perchè si tratta di implementare HTML e Java (anche se poche manciate di istruzioni) e io ho pressocchè zero conoscenza di entrambe i linguaggi.
Viene utilizzato un controllo access WebBrowser; ma se devo essere onesto mi sta dando molti problemi, per cui per il momento mi sto limitando a far creare il file Java ad access e poi lancio a mano il file HTML in modo da visualizzarlo sul browser del PC (magari sulla questione controllo WebBrower di Access tornerò in seguito)
In realtà, seguendo il tutorial non ho ottenuto risultati, per cui sono passato direttamente a documentarmi sulla libreria; in questo modo ho risolto (in parte) il problema, credo incompatibilità tra la versione della libreria che ho scaricato (l'ultima) e quella del tutorial (3-4 anni fa).
Sono arrivato a caricare su browser una mappa, più o meno corrispondente al risultato che mi aspettavo. Ma sui dettagli ci lavorerò piano piano.
Quello su cui vorrei chiedervi un aiuto è sulla generazione della mappa.
Questo è il file HTML che ho creato e lancio:
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./Service/leaflet/leaflet.css" />
<script src="./Service/leaflet/leaflet.js"></script>
<style>
html, body {
height: 100%;
padding: 0;
margin: 0;
}
#map {
/* configure the size of the map */
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
// initialize Leaflet
var map = L.map('map').setView({lon: -93.27324, lat: 37.37404}, 12);
// add the OpenStreetMap tiles
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: '© <a href="https://openstreetmap.org/copyright">OpenStreetMap contributors</a>'
}).addTo(map);
// show the scale bar on the lower left corner
L.control.scale({imperial: true, metric: true}).addTo(map);
L.marker({lon: -93.27647, lat: 37.20951}).bindPopup("Steak'n Shake Restaurant").addTo(map);
L.marker({lon: -93.25612, lat: 37.23984}).bindPopup("Rest Haven Motel").addTo(map);
L.marker({lon: -93.24899, lat: 37.24035}).bindPopup("Air And Military Museum Of The Ozarks").addTo(map);
</script>
</body>
</html>
Il problema lo riscontro nella sezione BODY; preciso che se lancio questo file HTML così come è funziona.
Il problema nasce perchè in realtà la sezione BODY (per essere più precisi si tratta della sezione SCRIPT contenuta in BODY) va creata volta per volta in quanto ovviamente i markers dei P.O.I. possono variare. Per creare la sezione SCRIPT, creo un file .js tramite alcune funzioni VBA di access.
In pratica, quello che ottengo è un file .js del tipo:
// initialize Leaflet
var map = L.map('map').setView({lon: -93.27324, lat: 37.37404}, 15);
// add the OpenStreetMap tiles
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: '© <a href="https://openstreetmap.org/copyright">OpenStreetMap contributors</a>'
}).addTo(map);
// show the scale bar on the lower left corner
L.control.scale({imperial: false, metric: true}).addTo(map);
L.marker([-93.27647, 37.20951]).bindPopup("Steak'n Shake Restaurant").addTo(map);
L.marker([-93.25612, 37.23984]).bindPopup("Rest Haven Motel").addTo(map);
L.marker([-93.24899, 37.24035]).bindPopup("Air And Military Museum Of The Ozarks").addTo(map);
Come si vede, è esattamente quello che si trova nella sezione BODY - SCRIPT del codice di sopra.
Per richiamarlo in maniera dinamica, la sezione BODY - SCRIPT va cambiata in questo modo:
<script type ="text/javascript" src=".Service/Script/mapSettings.js"></script>
cioe tutta la sezione SCRIPT si riduce a quella riga di codice, in cui (credo) gli si dice di prendere i dati contenuti nello scritp .js.
Fatto sta che se lancio il file HTML così modificato, non funziona più.
Suppongo che il problema risieda in quella variazione, ovvero nel modo in cui viene richiamato lo script JS.
Qualcuno mi può dare un aiuto a risolvere?
A occhio, così come creo il file .js tramite VBA potrei creare direttamente il file HTML completo, ma se la combinazione HMTL+JS può funzionare sarei curioso di sapere perchè non mi funziona.
Grazie a tutti
Andrea