1

I need to export / save the route details found using Leaflet Routing Machine in JSON or GeoJSON format.

I've tried to use

var routeArray = new Array();
routeArray = control.getWaypoints();
alert (JSON.stringify(routeArray));

that works but in this manner I obtain only the waypoints and, instead, I'm interested at ALL the route details (coordinates and descriptions).

I guess that "somewhere" they are (in the picture when I put my mouse pointer on a description I can see a little blue circle on the map as you can see .... )

enter image description here

Any suggestion, example, jsfiddle to help me? Thank you very much in advance!!!

Cesare

3 Answers 3

2

You need to handle routeselected event from your L.Routing.control object:

routingCtrl.on('routeselected', function(routes) {
    console.log(routes);
    console.log(routes.route.instructions);
}, this);

The routes variable contains all the information lealfet machine uses to build what you see on the screen. Check specifically routes.route.instructions and routes.route.coordinates objects

0
    .on('routesfound', function(e) {
        GeoJsonCode = L.Routing.routeToGeoJson(e.routes[0]);
        //console.log(GeoJsonCode);
    })

How about something like this? But I don't know where this is written.

2
0
    .on('routesfound', function(e) {
        GeoJsonCode = L.Routing.routeToGeoJson(e.routes[0]);
        //console.log(GeoJsonCode);
    })

How about something like this? But I don't know where this is written.

let result;
let sp4 = '    ';
let sp8 = sp4 + sp4;
let sp12 = sp8 + sp4; 

/* ルートをGeoJsonに変換
// https://github.com/perliedman/leaflet-routing-machine/blob/344ff09c8bb94d4e42fa583286d95396d8227c65/src/L.Routing.js
// https://leafletjs.com/examples/geojson/
-----------------------------------------*/
(function() {
    'use strict';

    L.Routing.routeToGeoJson = function(route) {
        var wpNames = [],
            wpCoordinates = [],
            i,
            wp,
            latLng;


        for (i = 0; i < route.waypoints.length; i++) {
            wp = route.waypoints[i];
            latLng = L.latLng(wp.latLng);
            wpNames.push(wp.name);
            wpCoordinates.push([latLng.lng, latLng.lat]);
        }

        // for file output >>>>>>
        let arr =  wpCoordinates;
        let str = "";
        // 一次→二次元配列への変換
        // https://note.shiftinc.jp/n/naba675050c86
        for(let i = 0; i < arr.length; i += 1) {
            str = str + '[' + arr.slice(i, i + 1) + '],';
        }
        
        str = str.slice(0, str.length - 1);
        str = '[' + str + ']';
        //console.log(str);

        result = '{' + '\n' + '"type": "FeatureCollection",' + '\n' + '"features": [' + '\n' + sp4 + '{' + '\n';
        result = result  + sp8 + '"type": "Feature",' + '\n' ;
        result = result  + sp8 + '"properties": {' + '\n' + sp12 + '"id": "waypoints",' + '\n' + sp12  + '"names":"' +  wpNames + '"' + '\n' + sp8 + '},' + '\n';         
        result = result  + sp8 + '"geometry": {'+ '\n' + sp12 + '"type": "MultiPoint",'+ '\n' + sp12 + '"coordinates":' +  str  + '\n' + sp8 +  '}' + '\n';
        result = result  + sp4 + '},' + '\n' + sp4 + '{' + '\n';
        result = result  + sp8 + '"type": "Feature",' + '\n' ;
        result = result  + sp8 + '"properties": {' + '\n' + sp12 + '"id": "line"' + '\n'  + sp8 + '},' + '\n'; 
        result = result  + sp8 + '"geometry": {' + '\n' + sp12 + '"type": "LineString",' + '\n' + sp12 +'"coordinates":' + L.Routing.routeToLineString(route) + '\n' + sp8 + '}'+ '\n' + sp4 + '}]' + '\n' + '}';
        //result = result  + sp8 + '"geometry": {' + '\n' + sp12 +'"coordinates":' + L.Routing.routeToLineString(route) + '\n' + sp8 + '}'+ '\n' + sp4 + '}]' + '\n' + '}';
        // <<<<<<<

        return result 
            /*{
            type: 'FeatureCollection',
            features: [
                {
                    type: 'Feature',
                    properties: {
                        id: 'waypoints',
                        names: wpNames
                    },
                    geometry: {
                        type: 'MultiPoint',
                        coordinates: wpCoordinates
                    }
                },
                {
                    type: 'Feature',
                    properties: {
                        id: 'line',
                    },
                    geometry: {
                        "type": "LineString",
                        "coordinates": L.Routing.routeToLineString(route)
                    }
                }]
            };*/   
    };

    L.Routing.routeToLineString = function(route) {
        var lineCoordinates = [],
            i,
            latLng;

        for (i = 0; i < route.coordinates.length; i++) {
            latLng = L.latLng(route.coordinates[i]);
            lineCoordinates.push([latLng.lng, latLng.lat]);
        }

        // for file output >>>>>>
        let arr =  lineCoordinates;
        let str = "";
        for(let i = 0; i < arr.length; i += 1) {
            str = str + '[' + arr.slice(i, i + 1) + '],' ;
        }

        str = str.slice(0, str.length - 1);
        //console.log(str); 
        let buf =  '[' + '\n' +  str  + '\n' + sp12 + ']';
        // <<<<<<<

        return buf
        /*{
            type: 'LineString',
            coordinates: lineCoordinates
        };*/
    };
})();
1
  • As it’s currently written, your answer is unclear. Please edit to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers in the help center.
    – Community Bot
    Commented Jun 2 at 0:59

Not the answer you're looking for? Browse other questions tagged or ask your own question.