react-nativereact-native-mapsmap-directions

MapViewDirections only shows one route. Should show alternative routes as well


Using MapViewDirections, I get a polyline as driving directions and a length of how far it is.

But what if I want to go there using another route? I dont get any grey polylines with alternative directions.

How to get those alternative route suggestions you know from Google maps etc?

      <MapView
        ref={mapRef}
        style={styles.map}
        initialRegion={middleOfDenmark}
      >
        {origin && <Marker coordinate={origin} />}
        {destination && <Marker coordinate={destination} />}
        {origin && destination && (
          <MapViewDirections
            origin={origin}
            destination={destination}
            apikey={Platform.OS === "ios" ? mapKitAPIKey : googleAPIKey}
            strokeColor="#112D4E"
            strokeWidth={4}
            onReady={calcDistanceOnReady}
          />
        )}
      </MapView>```

Solution

  • Found out it has to do with the Google API. So far it seems I must do something like this:

    const googleAPIKey = "YOUR_GOOGLE_API_KEY";    
    const requestDirections = async () => {    
     const origin = "origin_latitude,origin_longitude";     
     const destination = "destination_latitude,destination_longitude";     
     const params = {       
      origin,       
      destination,       
      mode: "driving",       
      alternatives: true, // Request alternative routes       
      key: googleAPIKey,     
     };