[Android] Image in PointAnnotation can't be shown on Android

To Reproduce Should be starting from 7.0.5 Release

            <View style={{height: 30, width: 21, backgroundColor: '#000'}}>
              <Image source={require('../../images/map/school.png')} />
            </View>
            <MapboxGL.Callout title='xxx' />
          </MapboxGL.PointAnnotation>

Screenshots

Versions (please complete the following information):

• Platfrom: Android
• Device: Asus Zenfone 5
• OS: Android 6
• SDK Version 28
• React Native Version 0.59

[RobertSasak]

Workaround is to wrap <Image/> with <Text/>. Or as @RichardLindhout wrote to use SVG instead. Source: https://github.com/react-native-community/react-native-maps/issues/431#issuecomment-524321467

const HackMarker = ({ children }) =>
    Platform.select({
        ios: children,
        android: (
            <Text
                style={{
                    lineHeight: 88, // there is some weird gap, add 40+ pixels
                    backgroundColor: '#dcdcde',
                }}>
                {children}
            </Text>
        ),
    })

Use like this

<MapboxGL.PointAnnotation
    coordinate={[0,0]}
    id="marker">
    <HackMarker>
        <Image source={marker} />
    </HackMarker>
</MapboxGL.PointAnnotation>

[subodhsri1]

Guys did you find the solution on it? if YES please guide.