How to enable tilt with react-native-maps?

Question

I'm using react-native-maps. My question is short. So how can I set initial camera horizontal position as fallow at image?

Answer 1

To tilt the map and view from another perspective, use animateToViewingAngle .

I am aware that it is inherently supported by iOS, so you should expect this behavior by default on iOS. However, I am not sure about Android.

More information, please visit this GitHub Thread .

Answer 2

Here is a code snippet that works for me

import React from 'react';
import MapView from 'react-native-maps';
import { StyleSheet, Text, View, Dimensions } from 'react-native';

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <MapView 
          showsBuildings
          ref={ref => { this.map = ref }}
          onLayout={() => {
            this.map.animateToBearing(125);
            this.map.animateToViewingAngle(45);
          }}
          initialRegion={{
            latitude: 41.8781,
            longitude: -87.6298,
            latitudeDelta: 1 / 300,
            longitudeDelta: 2 / 300
          }}
          style={styles.mapStyle}
        />
      </View>
    );
  }
}

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

snack demo https://snack.expo.io/Sym1DTm0r (working as for Dec 2019)