For now just show how routing is integrated in an existing leaflet application

After fixing the response in case of an error in the routing API we should switch to the simple deferred pipe. Or create workaround even before via this info

Its a bit hard to work with the npm package because when doRequest does not work it seems that the only return error message is that there is a bad request.

I was able to make a request work. Then I changed the address data for the services of the optimized route and all I get was "Bad Request".

After checking my code I saw that the lat/lng were strings instead of floats. After changing it it worked fine.

It would be nice if the returned error would give some hints what the problem could be.

At this line there is a resolve https://github.com/graphhopper/directions-api-js-client/blob/master/src/GraphHopperOptimization.js#L124

Is this correct or should it be reject?

• code examples for MapMatching (workaround: use live examples page)
• instead of generating a GPX string and passing that into the ghMapMatching.doRequest(gpxString) we could try to make it more like the Routing JS client (using ghRouting.addPoint)

I'm currently using Google's distance matrix to find distances between 1 point and many points. I'm using PHP to do so. Can I use your service as a replacement seeing my app already reaches the max request limit and I'm only just testing :)

If yes, do you have a PHP example which replaces this?

https://developers.google.com/maps/documentation/distancematrix/intro#DistanceMatrixResponses

Thanks in advance.

We should use a better vehicle routing examples showing also e.g. 3 or even 5 vehicles. And removing the bigger examples as they currently fail?

I wanted to use graphhopper js client in my Ionic app, so following the instructions explained here I have installed the package using npm, then tried to use the routing API.
All I did was import this:

import {graphhopper, GraphHopperRouting, GHInput} from 'graphhopper-js-api-client';

And then wrote:

var defaultKey = "[key]";
var profile = "foot";
var host;
var ghRouting = new GraphHopperRouting({key: defaultKey, host: host, vehicle:profile,elevation:false})

ghRouting.addPoint(new GHInput(47.400905, 8.534317));
 ghRouting.addPoint(new GHInput(47.394108, 8.538265));

 ghRouting.doRequest().then(function(json){
   console.log("Result: " + json)
 }).catch(function(err){
   console.log(err.message)
 })

Exactly as the guide explained.
When I run the code, the following error is shown:

Runtime Error
 __WEBPACK_IMPORTED_MODULE_6_graphhopper_js_api_client__.GraphHopperRouting is not a constructor

We should resolve the indices of the PathDetails with actual coordinates similar to what we are doing with the instructions. This will make it easier for consumers to use the PahtDetails.

It is a bit tricky to map the Instructions in the Request, so we should think about a method to make this easy for the user.

Use js instead of json loading so that we can append a version to the url and update the url if a change occured

There are tools that allow automated testing in different browsers and OS:
https://saucelabs.com/open-source
https://www.browserstack.com

Both are free for open-source software. Would be nice to know in which browsers the lib works and in which it doesn't. I think we need to write Selenium tests for this. Maybe in combination with the demo (I have no idea, haven't tried any of these tools).

Provide option to avoid creating the point array per instruction to reduce memory usage https://github.com/graphhopper/directions-api-js-client/blob/master/src/GraphHopperRouting.js#L185

An error occured: Bad Request - for url https://graphhopper.com/api/1/vrp/optimize?key=xxxxx

Hi

i create a local instance for testing localhost/graphhopper
i use the examples document for create my testing code i only modify the following code in examples, i put my key and try the demo localhost, working good with all items except when i change the coords lat and lon in the file tsp_lonlan_new.json
modify demo.js for set the center map

    $("#set_example_tsp").click(function () {
        $.getJSON("route-optimization-examples/tsp_lonlat_new.json?v=" + exampleVersion, function (jsonData) {

            clearMap();
            map.setView([4, -74], 6);
            $("#vrp-response").text("Calculating ...");
            ghOptimization.doRequest(jsonData)
                .then(optimizeResponse)
                .catch(optimizeError);
        });
    });

modify route-optimization-examples/tsp_lonlat_new.json for points

{
  "vehicles" : [{
    "vehicle_id" : "vehicle1",
    "start_address" : {
        "location_id" : "v1_startLoc",
        "lon": 4.713042,
        "lat": -74.05115
    },
    "type_id" : "vehicle_type_1"
  }],
  "vehicle_types" : [{
    "type_id" : "vehicle_type_1",
    "profile" : "car"
  }],
  "services" : [
    {
      "id": "b1",
      "name": "drink_bionade_in_rostock",
      "address": {
        "location_id": "loc_b1",
        "lon": 4.663407,
        "lat": -74.049069
      }
    },
    {
      "id": "b2",
      "name": "drink_cola_in_berlin",
      "address": {
        "location_id": "loc_b2",
        "lon": 4.744023,
        "lat": -74.064401
      }
    }
  ]
}

thanks for any help

I think it would be a nice improvement to host the js-client at a CDN. An easy solution seems to be this CDN. Another example would be cdnjs.

I'm currently trying to update a project using the old client (raw JS files) and have utilized graphhopper-client.js but I'm getting:

Unhandled rejection [11]</GHUtil.prototype.extractError@http://localhost:9000/js/graphhopper-client.js:33:792
[16]</GraphHopperOptimization.prototype.doRawRequest/</<@http://localhost:9000/js/graphhopper-client.js:47:1505
[4]</Request.prototype.callback@http://localhost:9000/js/graphhopper-client.js:15:5622
Request/<@http://localhost:9000/js/graphhopper-client.js:15:2198
[2]</Emitter.prototype.emit@http://localhost:9000/js/graphhopper-client.js:9:1093
[4]</Request.prototype._end/t.onreadystatechange@http://localhost:9000/js/graphhopper-client.js:15:6965

I think here is something wrong in the client but could also be in my usage. How do I create and associate a map file for debugging?

Related graphhopper/directions-api-clients#13

I think we should get rid of the JQuery dependency. We could use https://github.com/visionmedia/superagent but probably worth a different issue. (A more popular is https://github.com/request/request but it has also a lot dependencies)

Since we only use it for simple AJAX requests we could also write plain JS as described here.

We recently added PathDetails to the core. We should make it possible to use them with the JS client.

The link to GraphHopper Isochrone API screenshot is dead (404).

I guess we need a new key for the demo?

it can only deal with services

Hey!

I am a bit confused. I am pretty sure I have done similar requests before but today I got the error that I have to specify at least 2 points.

My request object:

// Request Object

{
   "vehicles":[
      {
         "vehicle_id":"vehicle1",
         "start_address":{
            "location_id":"r8SvLjPsCxedseLBS",
            "lon":8.4573,
            "lat":47.18206
         },
         "type_id":"vehicle_type_1"
      }
   ],
   "vehicle_types":[
      {
         "type_id":"vehicle_type_1",
         "profile":"car"
      }
   ],
   "services":[
      {
         "id":"3MoDrkrjRXdFgKQ6S",
         "name":"Born Hansruedi_Niederbipp_Hansruedi Born_3.71ha_20WP",
         "address":{
            "location_id":"field-3MoDrkrjRXdFgKQ6S",
            "lon":7.71862,
            "lat":47.25543
         }
      },
      {
         "id":"WQ3Nv4KtPBNHvZGR7",
         "name":"Born Hansruedi_Niederbipp_Hansruedi Born_1.41ha_6WP",
         "address":{
            "location_id":"field-WQ3Nv4KtPBNHvZGR7",
            "lon":7.71651,
            "lat":47.26037
         }
      },
      {
         "id":"xMKGdQ3S4aXft8nk3",
         "name":"Feld 1_aesch_regina nu_3.92ha_0WP",
         "address":{
            "location_id":"field-xMKGdQ3S4aXft8nk3",
            "lon":47.48199,
            "lat":7.57499
         }
      }
   ]
}

After init the gh routing class in nodejs I am doing:

import GraphHopperOptimization from 'graphhopper-js-api-client/src/GraphHopperOptimization';

const ghRouting = new GraphHopperOptimization({ key: '..', ...});

ghRouting.doRequest(requestObject).then(() => { ... }).catch((e) => { .... })

this will return the error I wrote above. As far as I can see I have 3 points (if the errors references to the list of services) I am confused. Am I missing here something?

For better understanding this is the full error msg:

Specify at least 2 points - for url https://graphhopper.com/api/1/route?&vehicle=car&debug=false&locale=en&points_encoded=true&instructions=true&elevation=false&optimize=false&key=$$$KEY$$&vehicles.vehicle_id=vehicle1&vehicles.start_address.location_id=r8SvLjPsCxedseLBS&vehicles.start_address.lon=8.4573&vehicles.start_address.lat=47.18206&vehicles.type_id=vehicle_type_1&vehicle_types.type_id=vehicle_type_1&vehicle_types.profile=car&services.id=3MoDrkrjRXdFgKQ6S&services.name=Born%20Hansruedi_Niederbipp_Hansruedi%20Born_3.71ha_20WP&services.address.location_id=field-3MoDrkrjRXdFgKQ6S&services.address.lon=7.71862&services.address.lat=47.25543&services.id=WQ3Nv4KtPBNHvZGR7&services.name=Born%20Hansruedi_Niederbipp_Hansruedi%20Born_1.41ha_6WP&services.address.location_id=field-WQ3Nv4KtPBNHvZGR7&services.address.lon=7.71651&services.address.lat=47.26037&services.id=xMKGdQ3S4aXft8nk3&services.name=Feld%201_aesch_regina%20nu_3.92ha_0WP&services.address.location_id=field-xMKGdQ3S4aXft8nk3&services.address.lon=47.48199&services.address.lat=7.57499

It seems that services is not added as an array. instead the generated url is overwriting the services before so at the end there is only one services.name, services.address, ....

If someone wants to know all surface or street name information per "leg" (one leg is between via points) the current process is a bit ugly, see this tutorial.

Hi, I've installed the js client and I would like to use Route Optimization API, but I'm not sure how I can use it.
I've required the whole client using require('graphhopper-js-api-client') and tried to call Routing with the parameter optimize:true as explained here :

var ghRouting = new GraphHopper.Routing({key: defaultKey, host: host, vehicle:profile,elevation:false,optimize:true})

The response I get are the points not sorted, they are in the order I've added them.
I've also tried using
var ghRouting = new GraphHopper.Optimization({key: defaultKey, host: host, vehicle_types:profile,elevation:false,calc_points:true})

But doesn't work. In the docs for Route Optimization API is not explained how to specifiy parameters for the constructor, so I'm a bit stuck.

Hello,

By the guideline, I did like below:

1. Install
   npm install graphhopper-js-api-client --save

2. Import libs I need only
   import * as GraphHopperRouting from 'graphhopper-js-api-client/src/GraphHopperRouting';
   import * as GHInput from 'graphhopper-js-api-client/src/GHInput';

3. Call functions
   var ghRouting = new GraphHopperRouting({key: 'defaultKey', host: 'host', vehicle: 'car', elevation: false});

   // Setup your own Points
   ghRouting.addPoint(new GHInput(47.400905, 8.534317));
   ghRouting.addPoint(new GHInput(47.394108, 8.538265));

4. Error comes out
   Uncaught ReferenceError: GraphHopperRouting is not defined at Object../node_modules/graphhopper-js-api-client/src/GraphHopperRouting.js (GraphHopperRouting.js:7) at __webpack_require__ (bootstrap:84)

An issue with the client right now is that if we add new parameters to the API, we have to change the client as well.

It would be great if we could make the client a bit more flexible. We could dynamically convert the args object into a request string and only add special handling for a few parameters or maybe we add a second route method that accepts a URL so that users can write their own url conversion if needed.

use leaflet 1.2.0 and latest jquery 3.2.1

Current workaround is to hardcore the semicolon and keep all the parameters in one array as strings. E.g (for areas in the form of lat, lng, radius)

block_area = [[1,1,1],[3,4,5],...]           doesn’t work
block_area = [ "1", "1", "1”, ";3", ”4”, "5"...]        does

Important to avoid reoccurrence of problems

Hmmh, what is then bower.js?