JavaScript client for the GraphHopper Directions API
JavaScript CSS HTML
Switch branches/tags
Nothing to show
Clone or download

README.md

JavaScript client for the Directions API

Build Status

This project offers JavaScript clients and examples for the GraphHopper Directions API.

Try the live examples here.

Also see how we integrated the Routing and the Geocoding API to build a fully featured maps application called GraphHopper Maps

Getting Started

CDN

You can use the hosted js client by adding it to your HTML like this:

 <script src="https://cdn.jsdelivr.net/npm/graphhopper-js-api-client/dist/graphhopper-client.js"></script>

You can then use it like this:

<script>
  window.onload = function() {

    var ghRouting = new GraphHopper.Routing({
      key: "[Sign-up for free and get your own key: https://www.graphhopper.com/products/]",
      vehicle: "car",
      elevation: false
    });

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

    ghRouting.doRequest()
      .then(function(json) {
        // Add your own result handling here
        console.log(json);
      })
      .catch(function(err) {
        console.error(err.message);
      });


  };
</script>

NPM

Install the lib with npm:

npm install graphhopper-js-api-client --save

You can either require the whole client enabling you to use every GraphHopper API, but you can also only require the pieces you need.

 require('graphhopper-js-api-client');
 // If you only need e.g. Routing, you can only require the needed parts
 //var GraphHopperRouting = require('graphhopper-js-api-client/src/GraphHopperRouting');
 //var GHInput = require('graphhopper-js-api-client/src/GHInput');
 
 window.onload = function() {
 
     var defaultKey = "[Sign-up for free and get your own key: https://www.graphhopper.com/products/]";
     var profile = "car";
 
     var host;
     var ghRouting = new GraphHopper.Routing({key: defaultKey, host: host, vehicle: profile, elevation: false});
     // If you only need e.g. Routing, you can only require the needed parts
     //var ghRouting = new GraphHopperRouting({key: defaultKey, host: host, vehicle: profile, elevation: false});
 
     // Setup your own Points
     ghRouting.addPoint(new GHInput(47.400905, 8.534317));
     ghRouting.addPoint(new GHInput(47.394108, 8.538265));
 
     ghRouting.doRequest()
     .then(function(json){
        // Add your own result handling here
        console.log(json);
     })
     .catch(function(err){
        console.error(err.message);
     });
 
 };

Running Tests

In order to run the tests, you have to register for a key on GraphHopper. Either set your key as environment variable using export GHKEY=YOUR_KEY or set your key in spec/helpers/config.js. You can run all tests via npm test. If you only want to run a single spec file, you can use the --spec option, e.g., npm test --spec spec/GraphHopperRoutingSpec.js.

Dependencies

The API depends on superagent and bluebird which are packaged into the graphhopper-client.js.

The demo uses a couple of dependencies, but they are not required for requests to the API.

Integrate the APIs in your application

You can either use our bundled version, including all APIs or you can use only the pieces you need.

GraphHopper Routing API

GraphHopper Routing API screenshot

You need the routing client.

There is also a different client developed from the community here.

GraphHopper Route Optimization API

Route Optimization API screenshot

You need the optimization client.

GraphHopper Isochrone API

GraphHopper Isochrone API screenshot

You need the isochrone client

GraphHopper Matrix API

GraphHopper Matrix API screenshot

You need the matrix client.

GraphHopper Geocoding API

GraphHopper Geocoding API screenshot

You need the geocoding client.

GraphHopper Map Matching API

GraphHopper Map Matching API screenshot

You need the map matching client and the togeojson.js

License

Code stands under Apache License 2.0