Constraining only latitude with unconstrained horizontal scroll

[mbenoukaiss]

This issue is actually a feature request : it is labelled as a bug because it originated from a bug and I originally planned on only creating this issue, however after trying to understand what causes this behaviour, I created issue #2072 which is the underlying bug. They are two separate issues and solving #2072 will not "solve" this feature request

What is the bug?

If cameraConstraint is set from -90;-180 to 90;180, panning to the horizontal edges of the map will be inconsistent and there is no way to have unconstrained horizontal scroll with latitude boundaries of -90 to 90. If you don't pan with enough speed it will stop at the border and if you pan with enough speed it will jump to the other side with some lag and it will be quite jerky.

Seems to be the same issue as #2005 don't know why he marked it as completed though ? Is there already a way to fix it I missed ?

How can we reproduce it?

Create a FlutterMap with the following property set in MapOptions : cameraConstraint: CameraConstraint.contain(LatLngBounds(const LatLng(-90, -180), const LatLng(90, 180))),

Do you have a potential solution?

I see two ways to fix the problem :

• Ignore the longitude constraints when they're 180 or -180, but it would make it impossible for someone to actually constrain a map to these longitudes if they want to
• Create a camera constraint that only constrains latitude

To work around it I opted for the second solution and made the following camera constraint class inspired from the other classes, it only constrains the camera on the latitude.

@immutable
class ContainCameraVertically extends CameraConstraint {
  const ContainCameraVertically(this.a, this.b);

  final double a;
  final double b;

  @override
  MapCamera? constrain(MapCamera camera) {
    final double testZoom = camera.zoom;
    final LatLng testCenter = camera.center;

    final Offset aPixel = camera.projectAtZoom(LatLng(a, 0), testZoom);
    final Offset bPixel = camera.projectAtZoom(LatLng(b, 0), testZoom);

    final Size halfSize = camera.size / 2;

    // Find the limits for the map center which would keep the camera within the
    // [a] and [b] bounds.
    final double topOkCenter = math.min(aPixel.dy, bPixel.dy) + halfSize.height;
    final double botOkCenter = math.max(aPixel.dy, bPixel.dy) - halfSize.height;

    // Stop if we are zoomed out so far that the camera cannot be translated to
    // stay within the [a] and [b] bounds.
    if (topOkCenter > botOkCenter) {
      return null;
    }

    final Offset centerPix = camera.projectAtZoom(testCenter, testZoom);
    final newCenterPix = Offset(centerPix.dx, centerPix.dy.clamp(topOkCenter, botOkCenter));

    if (newCenterPix == centerPix) {
      return camera;
    }

    return camera.withPosition(center: camera.unprojectAtZoom(newCenterPix, testZoom));
  }

  @override
  bool operator ==(Object other) {
    return other is ContainCameraVertically && other.a == a && other.b == b;
  }

  @override
  int get hashCode => a.hashCode ^ b.hashCode;
}

[mbenoukaiss]

I can make a PR to fix the issue, just give me indications on how you'd like this to be fixed

[JaffaKetchup]

Hi @mbenoukaiss, thanks for all the research.

ContainCameraVertically does seem to work nicely. As far as I'm concerned, this could be made the new default (maybe only if Crs.replicateWorldLongitude is true). We're more than happy to accept a PR!

If you don't pan with enough speed it will stop at the border and if you pan with enough speed it will jump to the other side with some lag and it will be quite jerky.

I think this needs to be fixed anyhow. Essentially, setting a constraint in this way should essentially turn off unbounded horizontal scrolling. I had a look into this, but from what I remember, there was some kind of limitation in the gestures system (I think I needed to know the new position before actually attempting to move there, but that was difficult).

---

I think this could be an opportunity to fix some of the rougher edges with the initial/constraints system - this is probably best for a seperate PR, but if you wanted to have a go, we'd be more than happy to have a look at that as well. I will potentially open a seperate issue.
The way FM was built, initialCameraFit came after initialCenter and initialZoom. This isn't ideal: it should be required initialCameraFit OR (initialCenter AND initialZoom). Instead, there's a default center built in which is seen sometimes when there is no initial specified or there is some issue and mismatching initial/constraints. I'm not sure the best way to fix this - I had a look into it a while ago and the knock-on effects were quite large and breaking.

[mbenoukaiss]

Hi,

ContainCameraVertically does seem to work nicely. As far as I'm concerned, this could be made the new default (maybe only if Crs.replicateWorldLongitude is true). We're more than happy to accept a PR!

I opened #2073 !

I think this needs to be fixed anyhow. Essentially, setting a constraint in this way should essentially turn off unbounded horizontal scrolling.

I believe basically any constraint that does not contain longitude -180/180 could automatically turn off unbounded horizontal scrolling, and the ones that do would not have the issue described in #2072. I'm not quite sure how it could be done though, maybe by adding a method on CameraConstraint that tells whether the constraint would make use of unbounded horizontal scrolling, and if the returned value is false, it gets disabled.

However I also stumbled on a limitation while experimenting with this, you can not constrain the camera across longitude -180/180. Take the example in #2072 about the south island of new zealand but now you want to constrain to the entirety of New Zealand (so between -33.55;160.85 and -44.94;-173.37). Due to the way LatLngBounds works by trying to find north/south latitudes and west/east longitudes from the provided boundaries, longitude constraints end up having the inverse effect and you can see everything but new zealand between latitudes -33.55 and -44.94.

EDIT: Linked to #1844 I guess

FlutterMap(
  options: MapOptions(
    minZoom: 0,
    initialZoom: 8,
    maxZoom: 17,
    initialCenter: const LatLng(-38.28, 170.54),
    cameraConstraint: CameraConstraint.contain(
      bounds: LatLngBounds(
        const LatLng(-33.55, 160.85),
        const LatLng(-44.94, -173.37),
      ),
    ),
  ),
  children: [
    openStreetMapTileLayer,
    RichAttributionWidget(
      popupInitialDisplayDuration: const Duration(seconds: 5),
      animationConfig: const ScaleRAWA(),
      showFlutterMapAttribution: false,
      attributions: [
        TextSourceAttribution(
          'OpenStreetMap contributors',
          onTap: () async => launchUrl(
            Uri.parse('https://openstreetmap.org/copyright'),
          ),
        ),
        const TextSourceAttribution(
          'This attribution is the same throughout this app, except '
          'where otherwise specified',
          prependCopyright: false,
        ),
      ],
    ),
  ],
),

This is all hypothetical and non blocking for me, I am not actually trying to make maps of New Zealand lol, but I suppose it could eventually end up being a problem for someone.

[JaffaKetchup]

I'm going to close this. There were essentially 3 issues:

• (main) Constraining latitude
  Fixed in feat: add ContainCameraLatitude #2073 - thanks :)
• Constraints across anti-meridian
  Filed separately in Unbounded horizontal scroll does not play well with longitude constraints near 180 or -180 #2072
• Constraints which do not include the anti-meridian should disable unbounded horizontal scrolling
  I need to test the current behaviour, if it needs to be done, then this is better filed separately - possibly as a low priority/feature request