FlutterMap 放大到白屏

Question

放大地图时，最后会出现白屏。有人知道为什么吗？

发生在 Android 和 iOS 上。在 emulator/simulator 和处于发布模式的物理设备上。适用于所有图块服务：Google、MapBox 和 OpenStreetMap。

Google 地图和 MapBox 包不会发生这种情况，但它们都太慢了，并且在它们显示的页面上滚动时会不断卡住列表视图。

这张 gif 显示了发生的情况：

这是我的最小代码示例：

Widget build(BuildContext context) {
  return Scaffold(
      body: FlutterMap(
    options: MapOptions(
      center: LatLng(routeLat, routeLong),
      zoom: 17.0,
    ),
    layers: [
      TileLayerOptions(
        urlTemplate:
            mapStringAndKey
      ),
      MarkerLayerOptions(
        markers: [
          Marker(
            width: 150.0,
            height: 100.0,
            point: LatLng(routeLat, routeLong),
            builder: (ctx) => Container(
              child: Column(
                children: [
                  Icon(
                    Icons.location_on,
                    size: 40,
                    color: Colors.blue,
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    ],
  ));
}

感谢您的任何想法。

Answer 1

这可能是因为 FlutterMap 正在尝试为不支持的缩放级别加载地图图块。每次缩放时，FlutterMap 都会为新的缩放级别获取图块。您应该定义一个 maxZoom 属性来阻止用户过度缩放并出现白屏。

FlutterMap(
   options: MapOptions(
      maxZoom: // your maxZoom value
   ),
   // ...
)

Answer 2

FlutterMap 提供最大和最小缩放，这可能是正确的，但使用 MapBox 或 Google 地图只会放大得更好。

我最终在全屏页面中使用了 MapBox 包 https://pub.dev/packages/mapbox_gl，它不会像在滚动视图中那样影响滚动，并且将使用静态图像，或者 flutter_map在滚动视图中确保滚动视图快速并将用户从那里重定向到地图。

FlutterMap 放大到白屏

FlutterMap zooms into white screen

flutter

fluttermap