react-native-maps-directions not shown up

Expo SDK
1

Please provide the following:

  1. SDK Version:“react-native-maps”: “0.30.2”,
    “react-native-maps-directions”: “1.8.0”,
  2. Platforms(Android/iOS/web/all):Android/iOS
  3. Add the appropriate “Tag” based on what Expo library you have a question on.

I ADD CANADA TORONTO CORDINATES IN MAPVIEW COMPONENT,AND ALSO ADD 2 LOCATION FOR ROUTING IN MapViewDirections COMPONENT.NO ERROR NOTIFICATION.APP JUST SHOW TORONTO AREA,BUT NO ROUTE BETWEEN LOCATION.

import * as React from ‘react’;
import MapView from ‘react-native-maps’;
import { StyleSheet, Text, View, Dimensions } from ‘react-native’;
import { StatusBar } from ‘expo-status-bar’;
import MapViewDirections from ‘react-native-maps-directions’;

const LATITUDE = 43.653225;
const LONGITUDE = -79.383186;
export default function App() {

const origin = {latitude: 43.791680, longitude: -79.312770};
const destination = {latitude: 43.785230, longitude: -79.293420};
const GOOGLE_MAPS_APIKEY = ‘AIzaSyBpAexI1D_HPIrR9xz_RqAAKDNlYKmW0Q8’;

return (

<MapView provider=“google”
initialRegion={{
latitude: LATITUDE,
longitude: LONGITUDE,
latitudeDelta: 0.0922,
longitudeDelta: 0.0421,
}}
style={styles.map} >
<MapViewDirections
origin={origin}
destination={destination}
apikey={GOOGLE_MAPS_APIKEY}
onError={(errorMessage) => {
console.log(‘GOT AN ERROR’);
}}
/>


);
}

const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: ‘#fff’,
alignItems: ‘center’,
justifyContent: ‘center’,
},
map: {
width: Dimensions.get(‘window’).width,
height: Dimensions.get(‘window’).height,
},
})

2

I’m also facing an Issue with Map view from react-native-maps in expo go. Google map simply does not show up, no matter what I do.

3

I’m having the same issue, map is blank with google logo at the bottom. I use my android device to test

4

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.