I have to create a customized cluster icon ,the icon will have count of the annotations that are clustered and the cluster icon border should take the colors from the annotation,let say if i have three annotations that are clustered and all three have different colored annotation icons then the customized cluster icon should have border with three equal parts of color in kotlin using mapbox .here is the img where clustered icon taking colors from the annotations.
private fun onMapReady() {
if (username.isNotEmpty()) {
val clusterOptions = ClusterOptions(
textColorExpression = color(Color.WHITE),
textColor = Color.BLACK,
textSize = 20.0,
circleRadiusExpression = literal(25.0),
colorLevels = listOf(
Pair(100, Color.RED),
Pair(50, Color.BLUE),
Pair(0, Color.BLACK)
)
)
val annotationPlugin = binding.mapView.annotations
pointAnnotationManager = annotationPlugin.createPointAnnotationManager(
AnnotationConfig(
annotationSourceOptions = AnnotationSourceOptions(
clusterOptions = clusterOptions
)
)
)
val destinations = listOf(
Point.fromLngLat(77.6396767, 12.9754017),
Point.fromLngLat(77.5912, 12.9797),
Point.fromLngLat(77.088590, 13.339040),
Point.fromLngLat(77.6212, 12.9797)
)
viewModel.getDeviceList().observe(viewLifecycleOwner) { cariTagDevices ->
if (cariTagDevices.isNotEmpty()) {
savedDeviceList = cariTagDevices
for (i in cariTagDevices.indices) {
val device = cariTagDevices[i]
if (i < destinations.size) {
val iconBitmap = CariTagUtils.getMarkerBitmapFromView(
requireContext(),
CariTagUtils.getIcon(device.iconId),
device.colorValue
)
if (iconBitmap != null) {
prepareAnnotationMarker(iconBitmap, device)
}
}
}
}
}
mapboxMap.loadStyleUri(Style.MAPBOX_STREETS) {
viewAnnotationManager = binding.mapView.viewAnnotationManager
circleAnnotationManager = mapView.annotations.createCircleAnnotationManager()
polylineAnnotationManager = mapView.annotations.createPolylineAnnotationManager()
}
}
}