3 thoughts on “Do you have plans to have a directions api in place?

  1. Starting from @christopherdro idea I used google directions api.

    getDirections(opts) {
        var fromCoords = opts.fromCoords;
        var toCoords = opts.toCoords;
        var url = 'https://maps.googleapis.com/maps/api/directions/json?mode=walking&';
            url += 'origin=' + fromCoords.latitude + ',' + fromCoords.longitude;
            url += '&destination=' + toCoords.latitude + ',' + toCoords.longitude + '&key=' + constants.GOOGLE_KEY;
    
        return new Promise((resolve, reject) => {;
          fetch(url)
          .then((response) => {
            return response.json();
          }).then((json) => {
            resolve(json);
          }).catch((err) => {
            reject(err);
          });
        });
      }

    from the response I used: data.routes[0].overview_polyline.points;

      _createRouteCoordinates(data) {
        if (data.status !== 'OK') {
          return [];
        }
    
        let points = data.routes[0].overview_polyline.points;
        let steps = Polyline.decode(points);
        let polylineCoords = [];
    
        for (let i=0; i < steps.length; i++) {
          let tempLocation = {
            latitude : steps[i][0],
            longitude : steps[i][1]
          }
          polylineCoords.push(tempLocation);
        }
    
        return polylineCoords;
      }

    Polyline it an object that is able to decode into an array with lat,lng coordinates the encoded polyline points. You can find it here. [https://github.com/mapbox/polyline]

    and finally

      <MapView.Polyline
        coordinates={this.state.polylineCoords}
        strokeWidth={2}
        strokeColor="red"
       />

    It works perfectly. Thanks @christopherdro for the idea.

    Good luck guys. Hope this post will be useful.