Get zoom level when cluster is created as a property

[guns28]

Hi All i want to uncluster the cluster when clicking on it, i think the best way is to get the exact zoom leevel when the cluster was created then zoom at that level and add a bit. i was wondering if anyone have tried it. thx

[edwinmrb]

As a quick solution is to obtain the current zoom of the map and add a considerable zoom, so that it is ungrouped.

double _currentZoom;

GoogleMap( mapType: MapType.normal, initialCameraPosition: CameraPosition(target: _currentLatLng, zoom: _zoomInitial), markers: _markers, onMapCreated: (GoogleMapController controller) { _controller.complete(controller); _manager.setMapId(controller.mapId); }, onCameraMove: (CameraPosition cameraPosition) { _currentZoom = cameraPosition.zoom; _manager.onCameraMove(cameraPosition); }, onCameraIdle: _manager.updateMap, zoomControlsEnabled: false, myLocationButtonEnabled: false, ),

Marker( markerId: MarkerId(cluster.getId()), position: cluster.location, onTap: () async { //Update camera Position, When onTap in Marker final GoogleMapController controller = await _controller.future; if (!cluster.isMultiple) { setState(() { _currentUserMapSelected = cluster.items.first; }); controller.animateCamera(CameraUpdate.newCameraPosition( CameraPosition(target: cluster.location, zoom: 10.0), )); } else { controller.animateCamera(CameraUpdate.newCameraPosition( CameraPosition(target: cluster.location, zoom: _currentZoom + 1), )); } }, icon: await _getMarkerBitmap(cluster), );

For an elegant solution, it would be necessary to calculate a midpoint on the grouped markers and establish an indicated zoom... for the group of markers.

If there is a solution to this, please share. Greetings

[hansvn]

@edwinmrb There is another way you could zoom in on the map to uncluster the markers without calculating the zoom level: Do a CameraUpdate with LatLngBounds from the markers in the cluster in the marker builder for the cluster.

ClusterManager<ClusterableMarker>(
  ...
  markerBuilder: _markerBuilder,
);

Future<Marker> Function(Cluster) get _markerBuilder => (cluster) async {
  return Marker(
    markerId: MarkerId(cluster.getId()),
    position: cluster.location,
    onTap: () async {
      // create points for the bounds
      double north = cluster.location.latitude;
      double south = cluster.location.latitude;
      double east = cluster.location.longitude;
      double west = cluster.location.longitude;
    
      // extend the bound points with the markers in the cluster
      for (var clusterMarker in cluster.items) {
        south = min(south, clusterMarker.location.latitude);
        north = max(north, clusterMarker.location.latitude);
        west = min(west, clusterMarker.location.longitude);
        east = max(east, clusterMarker.location.longitude);
      }
      
      // create the CameraUpdate with LatLngBounds
      CameraUpdate clusterView = CameraUpdate.newLatLngBounds(
          LatLngBounds(southwest: LatLng(south, west), northeast: LatLng(north, east)),
          16 // this is the padding to add on top of the bounds
      );
      
      // set the new view
      _mapController.animateCamera(clusterView);
    }
  },
  ...
);

[edwinmrb]

@hansvn this is very good solution, in fact I re-adjusted my code

[Shajk0]

@hansvn You are a genius, you helped me a lot with this code snippet. Thx