Waypoint in Map App

daveBuc

Nuovo Utente
6 Mar 2020
2
0
1
Buona pomeriggio a tutti,

sto cercando di scrivere una webApp inerente ad una mappa. L'idea principale che mi serve sviluppare è quella di andare ad evidenziare sul percorso una serie di waypoints, magari equidistanti. Sto cercando in tutti i modi di vedere se la cose è fattibile con le API di tomtom, visto che mi è stato richiesto di usare queste e non quelle di google, ma non trovo un modo per calcolare i waypoints dopo aver impostato il tragitto. L'unico modo in cui sono riuscito a farlo è stato aggiungendoli manualmente.

Vi allego la parte di codice che ho scritto:

HTML:
<!DOCTYPE html>
<html class='use-all-space'>

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
    <meta charset='UTF-8'>
    <title>Maps SDK for Web - Routing from my location</title>
    <meta name='viewport' content='width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no' />
    <link rel='stylesheet' type='text/css' href='sdk/map.css' />
    <link rel='stylesheet' type='text/css' href='elements.css' />
    <script type='text/javascript' src='js/form.js'></script>
    <script type='text/javascript' src='sdk/tomtom.min.js'></script>
    <style>
        label {
            display: flex;
            align-items: center;
            margin: 2px;
        }

        select {
            flex: auto;
            margin-left: 10px;
        }
    </style>
</head>

<body class='use-all-space'>
    <div id='map' class='use-all-space'></div>
    <script>
        // Define your product name and version
        tomtom.setProductInfo('<my_project>', '<my_project_version>');
        // Setting TomTom keys
        tomtom.routingKey('<myKey>');
        tomtom.searchKey('<myKey>');

        // Creating maps
        var map = tomtom.L.map('map', {
            key: '<myKey>',
        // key: '${api.key}',
            source: 'vector',
            basePath: '/sdk'
        });
        map.zoomControl.setPosition('topright');

        var unitSelector = tomtom.unitSelector.getHtmlElement(tomtom.globalUnitService);
        var languageSelector = tomtom.languageSelector.getHtmlElement(tomtom.globalLocaleService, 'search');

        var unitRow = document.createElement('div');
        var unitLabel = document.createElement('label');
        unitLabel.innerHTML = 'Unit of measurement';
        unitLabel.appendChild(unitSelector);
        unitRow.appendChild(unitLabel);
        unitRow.className = 'input-container';

        var langRow = document.createElement('div');
        var langLabel = document.createElement('label');
        langLabel.innerHTML = 'Search language';
        langLabel.appendChild(languageSelector);
        langRow.appendChild(langLabel);
        langRow.className = 'input-container';

        tomtom.controlPanel({
            position: 'bottomright',
            title: 'Settings',
            collapsed: true
        })
            .addTo(map)
            .addContent(unitRow)
            .addContent(langRow);

        // Adding route-inputs widget
        var routeInputs = tomtom.routeInputs({
            enableSearchBoxesModifcation: true
        }).addTo(map);

        // Adding route-on-map widget
        var routeOnMapView = tomtom.routeOnMap().addTo(map);

        // Connecting route-inputs with route-on-map widget
        routeInputs.on(routeInputs.Events.LocationsFound, function(eventObject) {
            routeOnMapView.draw(eventObject.points);
        });
        routeInputs.on(routeInputs.Events.LocationsCleared, function(eventObject) {
            routeOnMapView.draw(eventObject.points);
        });

        // Show notification on route-inputs widget when the user location cannot be detected
        routeInputs.on(routeInputs.Events.LocationError, function() {
            routeInputs.showLocationNotFoundMessageBox();
        });
    </script>
</body>

</html>

In questo modo, come vi dicevo riesco ad inserire manualmente i waypoints ma vorrei che li calcolasse automaticamente quando inserisco partenza e destinazione, e che mi comparissero sulla mappa. Ciò poi mi servirebbe per calcolare alcune cose, ma è un discorso secondario.

Spero che qualcuno possa aiutarmi.

Vi ringrazio
 
Discussioni simili
Autore Titolo Forum Risposte Data
T cms con visualizzazione mind map CMS (Content Management System) 0
I [Javascript] Leggere "var" da file .js esterno (per google map) Javascript 6
B Creare menu a tendina su image map HTML e CSS 1
W Google map e download dati Database 0
M Passare coppie di coordinate in una google map Javascript 0
J Google map PHP 0
J Consiglio Script google map Javascript 3
F calcolo percorso google map PHP 0
F Google map personalizzato Javascript 1
A Non visualizza google map dentro la mia app Android Sviluppo app per Android 1
P mouseOver su area map Javascript 8
P Popolare un Database da una mappa di google map PHP 7
A cambiare la site map HTML e CSS 2
unkus_nob chiusura automatica infowindow google map Javascript 0
P Limiti dell' uso delle API di google map Javascript 0
B onmouseover, immagini multiple su hotspot map Javascript 3
borgo italia site map google SEO e Posizionamento 3
P Problema con marker della google map Javascript 0
V Markers su google map da selezione PHP 0
JellyBelly api cellid google map Javascript 1
JellyBelly Passare Parametro per filtrare i maker per google map Javascript 0
W OnMouseOver su una map area HTML e CSS 5
A App Videosrveglianza Dahua IP Cam e Videosorveglianza 0
simgia Cordova errore quando cerco di emulare o creare la app Sviluppo app per Android 2
E Android app start Discussioni Varie 1
E Problema accesso a file con app sviluppata con MIT APP INVENTOR 2 Sviluppo app per Android 0
C Come sviluppare la primissima app Sviluppo app per Android 2
M Autorizzazioni in fase di instalazione di un app Sviluppo app per Android 2
V [Cerco] Socio e Sviluppatore per App PlacesFinder Offerte e Richieste di Lavoro e/o Collaborazione 0
D sviluppo app eventi + libri Sviluppo app per Android 0
L File CSV con app inventor da errore Sviluppo app per Android 2
P App webview Sviluppo app per Android 0
G Avviare un activity quando l'app è chiusa Sviluppo app per Android 0
S WEB APP PER AUTOMATIZZARE TASK INSTAGRAM Annunci servizi di Social Media Marketing 0
Tommy03 App mobile+ sito web con lo stesso database Sviluppo app per Android 4
INTEROPERABILITY Sviluppatrice/formatrice creare APP Offerte e Richieste di Lavoro e/o Collaborazione 0
M Impossibile visionare la immagini dall'App. IP Cam e Videosorveglianza 8
S CERCO CREATORE APP PER E-COM IOS/ANDROID Sviluppo app per Android 1
AC1 Sviluppo App Sviluppo app per Android 2
A [Offro][retribuito] Creazione siti web/ web app (Django) Offerte e Richieste di Lavoro e/o Collaborazione 2
Q Leggere NFC da web app - web nfc Javascript 0
D App per Timbrare il cartellino. Offerte e Richieste di Lavoro e/o Collaborazione 2
O MIT App Inventor - caricare un file da app Sviluppo app per Android 1
Tommy03 Due menù nella stessa app Sviluppo app per Android 0
P Pubblicazione app store gioco alcolico Sviluppo app per iOS 1
R Trasferire app su scheda SD Sviluppo app per Android 1
R Accesso a Mit APP Inventor2 Sviluppo app per Android 0
M Trasformare sito in app Sviluppo app per Android 0
S [OFFRO] Traduzione impeccabile ITA->ENG e ENG->ITA per App, Siti Web, Blog Offerte e Richieste di Lavoro e/o Collaborazione 0
M App 6° di separazione Sviluppo app per Android 0

Discussioni simili