Custom image markers not appearing on iOS

[Vel1khan]

Custom image markers appear to not render properly on iOS.

I'm using a custom marker defined as follows:

type MemoMarkerProps = {
  coordinate: LatLng
  museum: Museum
  onPress(): void
}

const MemoMarker = ({ museum, onPress }: MemoMarkerProps) => {
  return (
    <Marker
      coordinate={{
        latitude: museum.latitude,
        longitude: museum.longitude
      }}
      tracksViewChanges={false}
      image={loadMapIcon(museum.typeid)}
      onPress={onPress}
    />
  )
}

I am also using a custom cluster marker defined as follows:

type ClusterMemoMarkerProps = {
  cluster: any
}

const ClusterMemoMarker = (props: ClusterMemoMarkerProps) => {
  const { geometry, onPress, properties } = props.cluster
  const points = properties.point_count
  const { width, height, fontSize, size, clusterColor, borderColor } = getMarkerStyle(points)
  return (
    <Marker
      coordinate={{
        longitude: geometry.coordinates[0],
        latitude: geometry.coordinates[1]
      }}
      style={{ zIndex: points + 1 }}
      onPress={onPress}
      tracksViewChanges={false}
    >
      <TouchableOpacity activeOpacity={0.5} style={[styles.container, { width, height }]}>
        <View
          style={[
            styles.wrapper,
            {
              backgroundColor: clusterColor,
              width,
              height,
              borderRadius: width / 2,
              opacity: 1
            }
          ]}
        />
        <View
          style={[
            styles.cluster,
            {
              backgroundColor: 'white',
              width: size,
              height: size,
              borderRadius: size / 2,
              borderWidth: 3,
              borderColor: borderColor
            }
          ]}
        >
          <Text style={[styles.text, { fontSize: fontSize }]}>{points}</Text>
        </View>
      </TouchableOpacity>
    </Marker>
  )
}

I have also tried to instead of using the image attribute of <Marker/> to instead do <Marker><><Image/></><Marker/> however the same behaviour happens but performance is worse. These exact same custom markers appear when using the default MapView from 'react-native-maps'. The strange thing is that when using the default markers, it works perfectly:

iOS (iPhone 13 Pro, software version 15.4.1)

https://user-images.githubusercontent.com/35954057/169511300-e836c66a-4fb0-437c-ba0a-5a149469ef3a.mp4

Android

https://user-images.githubusercontent.com/35954057/169515020-a99dd767-1542-4b69-b76f-7d93ee98424e.mp4

[Miilla]

try to remove tracksViewChanges={false} from Marker