Search code examples
react-nativegoogle-mapsreact-native-maps

Rotate Overlay in react-native-maps

Is there any way to rotate the Overlay component in react-native-maps ? I tried to use the bearing prop. But it seems the prop is not available. Tried to rotate using the style prop as well. It didn't work either

<Overlay
            image={IMAGE_URL}
            style={{transform: [{ rotate: '90 deg' }]}}   // not working
            bearing={VALUE}  // not working
            bounds={BOUNDS}
            location={LOCATION}
            anchor={[0.5, 0.5]}
            width={WIDTH}
            height={WIDTH}
          />
Solution

  • I found the solution. Install the react-native-maps library from the master branch. In the master branch, Overlay component has the bearing prop. Use the below command

    npm install https://github.com/react-native-maps/react-native-maps.git#master --save