Zoom map to fit bounds

[basvdijk]

Is there a way to zoom the map to fit a certain set of coordinates? For example, I want to zoom the map so it fits my drawn GeoJSON line. Mapbox GL has the fitBounds for this: https://docs.mapbox.com/mapbox-gl-js/example/fitbounds/

[ristiisa]

check cameraForCoordinateBounds function: https://github.com/mapbox/mapbox-maps-flutter/blob/1daef17c48fd927db442a5d19f7aca06a1ffdc63/example/lib/camera.dart#L44-L62

[basvdijk]

Thanks @ristiisa I copied / pasted this part into my project and somehow it gives this error:

I have aliased the Mapbox map package as MB:

import 'package:mapbox_maps_flutter/mapbox_maps_flutter.dart' as `MB`;

However, when I add .toJson() the problem goes away:

  mapboxMap
        ?.cameraForCoordinateBounds(
          CoordinateBounds(
            southwest: Point(coordinates: Position(1.0, 2.0)).toJson(),
            northeast: Point(
              coordinates: Position(
                3.0,
                4.0,
              ),
            ).toJson(),
            infiniteBounds: true,
          ),
          MbxEdgeInsets(top: 1, left: 2, bottom: 3, right: 4),
          10,
          20,
          null,
          null,
        )
        .then(
          (value) => ScaffoldMessenger.of(context).showSnackBar(
            SnackBar(
              content: Text(
                'Camera zoom: ${value.zoom}, pitch: ${value.pitch}, bearing: ${value.bearing},padding: ${value.padding},center: ${value.center}',
              ),
              backgroundColor: Theme.of(context).primaryColor,
              duration: const Duration(seconds: 2),
            ),
          ),
        );

Any thoughts why the example project does not need .toJson() while I need to?

[ristiisa]

Any thoughts why the example project does not need .toJson() while I need to?

because they have recently added typings, you just need to get the latest version or don't what ever works for you :)

[maios]

Hi @basvdijk, as @ristiisa mentioned, we recently added support for strong typed coordinates (please check the implementation in https://github.com/mapbox/mapbox-maps-flutter/pull/448), but it has not been included in any releases yet. If you are not using our latest commit from main branch, for now you have to convert Point.toJson()

[basvdijk]

@maios @ristiisa Thansk for clarifying! I can confirm that the zoom to bounds solution in the first reply works now :)