[Bug] [Android] Custom Marker Image Disappears in v1.23.12+ with image={require(...)}; worked in v1.23.8 but without resizable support

Summary

🐛 Bug Report

There seems to be a regression with the <Marker image={require(...)} /> behavior starting from v1.23.12.

• In v1.23.8, the image renders correctly but does not respect any custom width/height.
• In v1.23.12, width and height are applied, but the image disappears completely.
• In v1.24.3, the latest version, the issue persists — the image is not visible, even though dimensions can be set.

---

✅ Expected Behavior

• The static marker image (e.g. PNG via require(...)) should render on the map
• Custom dimensions (width, height) should be respected across screen densities
• Should support both iOS and Android

---

❌ Actual Behavior

Version	Renders Image	Supports width/height
1.23.8	✅ Yes	❌ No
1.23.12	❌ No (disappears)	✅ Yes
1.24.3	❌ No (still disappears)	✅ Yes

No error in logs — just invisible marker.

Reproducible sample code

const nearbyGarages = [
    {
      id: '1',
      name: 'Turbo Tune-Up Garage',
      rating: 4.8,
      address: '1234 Market Street, PA 19107',
      distance: '4.5 Miles',
      recommended: true,
      image: require('../../../../assets/images/car.png'),
      coordinate: {
        latitude: 11.0168,
        longitude: 76.9558,
        latitudeDelta: 0.01,
        longitudeDelta: 0.01,
      },
    },
    {
      id: '2',
      name: 'Turbo Tune-Up Garage 2',
      rating: 4.8,
      address: '1234 Market Street, PA 19107',
      distance: '4.5 Miles',
      recommended: true,
      image: require('../../../../assets/images/car.png'),
      coordinate: {
        latitude: 11.0129,
        longitude: 76.9558,
        latitudeDelta: 0.01,
        longitudeDelta: 0.01,
      },
    },
    {
      id: '3',
      name: 'Turbo Tune-Up Garage 3',
      rating: 4.8,
      address: '1234 Market Street, PA 19107',
      distance: '4.5 Miles',
      recommended: true,
      image: require('../../../../assets/images/car.png'),
      coordinate: {
        latitude: 11.0157,
        longitude: 76.9558,
        latitudeDelta: 0.01,
        longitudeDelta: 0.01,
      },
    },
  ];

<MapView
        provider={PROVIDER_GOOGLE}
        style={styles.map}
        // ref={mapRef}
        region={region}
        mapType="standard">
               {nearbyGarages.map((garage, index) => (
          <Marker
            // style={styles.marker}
            key={index}
            coordinate={garage.coordinate}
            title={garage.name}
            description={garage.address}>
            <CustomMarker garage={garage} />
          </Marker>
        ))}
</MapView>

const CustomMarker = ({garage}) => {
    return (
      <View style={styles.markerContainer}>
        <Image
          source={require('../../../../assets/images/car.png')}
          style={styles.markerImage}
        />
        <View style={styles.ratingContainer}>
          <Text style={styles.ratingText}>⭐ {garage.rating}</Text>
        </View>
      </View>
    );
  };

 const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  headerContainer: {
    height: 110,
  },
  markerContainer: {
    flex: 1,
    alignItems: 'center',
    backgroundColor: 'transparent',
    height: 80,
    width: 80,
    borderRadius: 12,
    padding: 5,
    shadowColor: '#000',
    shadowOffset: {width: 0, height: 2},
    shadowOpacity: 0.1,
    shadowRadius: 4,
    elevation: 3,
  },

  markerImage: {
    borderColor: 'white',
    borderWidth: 3,
    borderRadius: 10,
    width: 60,
    height: 60,
  },

  ratingContainer: {
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: 'white',
    borderRadius: 8,
    paddingHorizontal: 8,
    paddingVertical: 4,
    marginTop: -10,
    elevation: 2,
    shadowColor: '#000',
    shadowOffset: {width: 0, height: 1},
    shadowOpacity: 0.1,
    shadowRadius: 2,
  },

  ratingText: {
    fontSize: 12,
    color: '#333',
    fontWeight: 'bold',
  },
  map: {
    width: '100%',
    height: '88%',
  },  
});

Steps to reproduce

• Install react-native-maps v1.24.3
• Run it on an Android emulator or device
• The image is not visible, though no error is thrown.

Expected result

Actual result

React Native Maps Version

1.24.3

What platforms are you seeing the problem on?

Android

React Native Version

0.79.2

What version of Expo are you using?

Not using Expo

Device(s)

Pixel 7

Additional information

No response

Faceing the Same issue , with my build custom marker images are not visible as soon as i upated to new architecture and to 1.24

Might be related to #5566

We have the same problem, having looked into the code to try to help fix it, it seems we can neither redraw nor use tracksViewChanges - the former is removed in a broken way on Android (it's in Commands but not FabricCommands - so calling it causes a JS crash with the new arch), and the latter does not appear to be hooked up from JS to the view through the MarkerManager on Android. So you just get the first render of whatever marker, unless something else causes the map and markers to update.

I'd love to help fix this but would need some guidance on the intended behaviour. Are either or both of the above intentional or is there a new architecture conversion miss here?

I’m concerned this issue could block many projects — especially those built with Expo.

On Android, the 16KB page size requirement and Android 15 compatibility are pushing developers to adopt the new architecture and upgrade SDK versions. However, this marker image regression complicates the upgrade path.

Here’s my experience across versions:

v1.20.1: Doesn’t work due to architecture upgrade requirements

v1.23.8: Partially works (image shows but resizing doesn't)

v1.23.12: Marker disappears completely

v1.24.3: Same issue — marker still invisible

If there’s no workaround or fix, it could effectively block production use of react-native-maps for a significant number of apps targeting newer Android versions. Any updates or guidance would be much appreciated.

I need help to fix. Any solution? Thanks

Any fix or workaround?

Tried the latest release 1.25.0 on Android with the latest Expo and the new architecture turned on, still not fixed for me. The GPS blue dot is not shown but the location can be focused to. Custom Markers are not shown or only partially shown. Anyone has tweaks to make it working again? It is strange that it must work for some people - so not everyone is complaining but for others that's having the problem, there are no alternatives.

when fix coming ???

Using Expo Image instead of React Native Image seemed to help, but still some refreshing issues.

facing same issue....is there any solution

Up