When two markers are close to each other, clicking on the exact same spot won’t always trigger the same marker, and it gets worse if z-indexes are involved

[tfcporciuncula]

I’ve reproduced the issue on a Pixel 4a and Zenfone 10 both running Android 13.

• Run the sample and tap on the “Marker Clustering” button. Lots of markers there, so it’s a good place to reproduce the issue.
• Reach a zoom level where you get two markers close to each other, something like this:

• Keep tapping on an isolated point in one of the markers, where there shouldn’t be any doubts about which marker is being tapped, and then observe that clicking on the same point will sometimes trigger one marker, and sometimes the other:

https://github.com/googlemaps/android-maps-compose/assets/750114/f1456ded-dc01-4efb-ad0b-cb952ce30e5f

• This is weird but it’s not so bad. I guess this may actually be an accessibility feature so it’s easy to switch back and forth between nearby markers? It gets more interesting if the markers have z-indexes set, so let’s observe this again with custom markers this time. You can run the code below within the sample:

val markers = listOf(LatLng(51.721695, 10.393405), LatLng(51.824536, 10.537953))
var highlightedMarkerIndex by remember { mutableIntStateOf(0) }
val cameraPositionState = rememberCameraPositionState {
  position = CameraPosition.fromLatLngZoom(markers[highlightedMarkerIndex], 7.5f)
}

Box(Modifier.fillMaxSize()) {
  GoogleMap(
    modifier = Modifier.fillMaxSize(),
    cameraPositionState = cameraPositionState,
  ) {
    markers.forEachIndexed { index, marker ->
      MarkerComposable(
        highlightedMarkerIndex,
        state = rememberMarkerState(position = marker),
        anchor = Offset(0.5f, 0.5f),
        onClick = {
          highlightedMarkerIndex = index
          true
        }
      ) {
        Box(
          modifier = Modifier
            .size(32.dp)
            .background(if (index == highlightedMarkerIndex) Color.Red else Color.Gray),
        )
      }
    }
  }
}

• And observe the same thing there. It’s just a map with two square markers and whenever a marker is tapped, it becomes red:

https://github.com/googlemaps/android-maps-compose/assets/750114/59b41ca2-4d52-4e22-85ed-b0cadebc7f41

• Now let’s make the highlighted marker always be on top by passing zIndex = if (index == highlightedMarkerIndex) 1f else 0f, and here’s where the experience really starts feeling broken: now in order to highlight the non-highlighted marker, you have to tap twice.

https://github.com/googlemaps/android-maps-compose/assets/750114/8a8be3c5-90ff-4910-a21f-842768579f8d

I went through multiple examples to try to explain all the weirdnesses I've identified while investigating this, but this last part is the real issue to me. We're highlighting markers and making sure the highlighted marker has a higher z-index, but this is causing the first tap to a nearby marker to be ignored as it's demonstrated above.

[wangela]

If you would like to upvote the priority of this issue, please comment below or react on the original post above with :+1: so we can see what is popular when we triage.

@tfcporciuncula Thank you for opening this issue. 🙏 Please check out these other resources that might help you get to a resolution in the meantime:

• Check the issue tracker - bugs and feature requests for Google Maps Platform APIs and SDKs
• Open a support case - Get 1:1 support in Cloud Console.
• Discord - chat with other developers
• StackOverflow - use the google-maps tag

This is an automated message, feel free to ignore.

[tfcporciuncula]

Just an extra thought: it feels like when I update the z-index of the marker I just clicked, it’s like the higher z-index makes the marker gain precedence on capturing nearby taps, even if they’re aimed at another marker. So after tapping on it and increasing its z-index, it’s like any other tap nearby will be captured by it again because of the increase in the z-index.

There’s clearly some unusual behavior around z-indexes and touch targets and that’s basically the best explanation I could come up with based on what I’ve observed.

[kikoso]

Hi @tfcporciuncula . I am able to reproduce this. There is certainly an issue when setting the Z-Index. Not sure if this fully belongs to the android-maps-compose SDK, checking it. Thanks for reporting it!

[mariohide]

Same here, in my case, I have multiple markers(MarkerComposable) at same position with different rotation, click on A, but B notified.

[juanluismari]

Hi @tfcporciuncula . I am able to reproduce this. There is certainly an issue when setting the Z-Index. Not sure if this fully belongs to the android-maps-compose SDK, checking it. Thanks for reporting it!

Hello @kikoso, I noticed that same issue happens also to me with the latest version of compose maps (6.4.0), I am writing the steps I took just and also a slice of code just if it can help a bit... but tbh, they are the same as this issue. I tried to mitigate the "flickering" effect on the marker when clicked as the last video from @tfcporciuncula shows, but I couldn't.

1. Add list of markers (custom MarkerComposable).
2. My z-index depends on a boolean attribute. True -> 1.0f | False -> 0.0f
3. Only sometimes, when the z-index is updated, a flickering effect "movement" of the marker happens very quickly (as the last video shown in this issue).

data class MarkerConfig(
    val latitude: Double,
    val longitude: Double,
    val tag: String,
    val type: MarkerType,
    val isClickable: Boolean = true,
    val isSelected: Boolean = false,
    val onMarkerClicked: (tag: String, isSelected: Boolean) -> Unit = { _, _ -> }
)

val positionState = rememberMarkerState(position = LatLng(markerConfig.latitude, markerConfig.longitude))
MarkerComposable(
    keys = arrayOf(markerConfig.isSelected),
    state = positionState,
    onClick = { onMarkerClicked(markerConfig) },
    zIndex = if (markerConfig.isSelected) 1.0f else 0.0f,
) {
    ComposeMapMarker(
        type = markerConfig.type,
        isSelected = markerConfig.isSelected,
    )
}

Do you have any updates about this issue? If I can provide more info I would be delighted to do it. Thanks!!

[samuolis]

The issue has been present for a long, long time. It was present with XML based maps too from 2013 https://issuetracker.google.com/issues/35823783

As under the hood they still used views this issue should be solved there.

I had a workaround with transparent info window (it puts marker on top), but this behaviour is not working anymore with latest renderer.

It would be really nice if google would take care of it