Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
4.0k views
in Technique[技术] by (71.8m points)

flutter - FlutterMap zooms into white screen

When zooming in on the map, it creates a white screen at the end. Anyone have any idea why?

Happens on both Android and iOS. On emulator/simulator and on physical device in release mode. Happens with all tile services: Google, MapBox & OpenStreetMap.

It does not happen with Google Maps and MapBox packages, but they are both so slow and janks the list view continuously when scrolling on the page where they show.

This gif shows what happens:

enter image description here

Here is a my minimal code example:

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,
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    ],
  ));
}

Thank you for any ideas.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

It is probably because FlutterMap is trying to load map tiles for an unsupported zoom level. Each time you are zooming, FlutterMap is fetching tiles for the new zoom level. You should define a maxZoom property to stop the user from zooming too much and getting a white screen.

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

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...