Clustering feature with custom view annotation

[michal-bogucki]

Environment

• Android OS version: 14
• Devices affected: All
• Maps SDK Version: 11.2.2 and 11.3.0-rc.1

Observed behavior and steps to reproduce

I would like to use this and clustering options

I create points using PointAnnotationOptions. Adds points to pointAnnotationManager. Then I want to add a custom view using addViewAnnotation. And now the points overlap the clusters instead of disappearing. There is also a problem that when a cluster is created, points further away are visible on the map instead of disappearing.

listPoint.map { mapPoint ->
            val jsonString = gson.toJson(mapPoint)
            val pointAnnotationOptions = PointAnnotationOptions().withPoint(mapPoint.point)
                .withData(JsonParser.parseString(jsonString))
            pointAnnotationOptionsList.add(pointAnnotationOptions)
        }

val annotationConfig = AnnotationConfig(
        annotationSourceOptions = AnnotationSourceOptions(
            clusterOptions = ClusterOptions(
                circleRadius = 24.0,
                colorLevels = listOf(Pair(0, Blue500.toArgb())),
                clusterMaxZoom = 15
            )
        )
    )

AndroidView(
            factory = {
                MapView(it).also { mapView ->
                    mapView.mapboxMap.loadStyle(Style.STANDARD)
                    val annotationApi = mapView.annotations
                    pointAnnotationManager =
                        annotationApi.createPointAnnotationManager(annotationConfig)
                    mainMapboxMap = mapView.mapboxMap
                    setupCamera(mapView, startZoom, centerPoint)
                    setMaxZoom(mapView, maxZoom)
                    mapView.mapboxMap.subscribeCameraChanged(callback)
                }
            }, update = { mapView ->
                mainMapboxMap = mapView.mapboxMap
                pointAnnotationManager?.let { manager ->
                    manager.deleteAll()
                    mapView.viewAnnotationManager.removeAllViewAnnotations()
                    val listP = manager.create(pointAnnotationOptionsList)
                    listP.map { pointAnnotation ->
                        var viewAnnotation: View = mapView.viewAnnotationManager.addViewAnnotation(
                            resId = R.layout.annotation_view,
                            options = viewAnnotationOptions {
                                geometry(pointAnnotation.geometry)
                                allowOverlap(true)
                            }
                        )

                        viewAnnotation.setOnClickListener {
                            val data = pointAnnotation.getData()
                            val item = gson.fromJson(data, MapItemListLiteModel::class.java)
                            onClickPoint(item.itemId)
                        }

                        if (viewAnnotation.isVisible) {
                            val data = pointAnnotation.getData()
                            val item = gson.fromJson(data, MapItemListLiteModel::class.java)
                            AnnotationViewBinding.bind(viewAnnotation).apply {
                                icon.load(item.url) {
                                    crossfade(true)
                                    memoryCacheKey(MemoryCache.Key(item.itemId.toString()))
                                    diskCacheKey(item.itemId.toString())
                                    transformations(CircleCropTransformation())
                                }
                            }
                        }
                    }
                  
                }

            }, modifier = modifier
        )

Expected behavior

The points should disappear and only clusters remain on the map.

Additional links and references

https://github.com/mapbox/mapbox-maps-android/assets/26688267/18018f99-80cf-472b-a636-fa29f586f496