1    const AnimatedImage = Animated.createAnimatedComponent(Image)
2
3export default (props) =>  {
4    const rotation = useRef(new Animated.Value(0)).current
5    const bearingDegree = rotation.interpolate({
6        inputRange: [0, 360],
7        outputRange: ['0deg', '360deg'],
8    });
9   useEffect(() => {
10        if(props.bearing !== null || props.bearing !== undefined) {
11            Animated.timing(rotation, {
12                toValue: props.bearing,
13                useNativeDriver: true,
14                duration: 10000,
15            }).start()
16        }
17    }, [props.bearing])
18
19  return (
20        <Marker.Animated
21            coordinate={markerOrigin.current.region}
22            ref={marker}
23            flat
24            anchor={{ x: 0.5, y: 0.5 }}
25        >
26            <AnimatedImage
27                source={require('../../assets/images/motor-map.png')}
28                style={[styles.bike, {transform: [{rotate: bearingDegree}]}]}
29                resizeMode="contain"
30            />
31        </Marker.Animated>
32    )
33}
34
35
36