Flutter模拟器中无法加载OpenStreetMap地图的求助

云原生阿岚

2026-6-14

问题描述

通过flutter run --debug启动Flutter应用，应用支持根据后端配置切换Google Map与OpenStreetMap（当前默认使用OpenStreetMap），但模拟器中地图完全不显示，运行日志如下：

PS C:\Users\useru\Downloads\Main-File-Dec-20\EDITED\flutter_user> flutter run --debug
Launching lib\main.dart on sdk gphone x86 64 in debug mode...
Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: Some input files use unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.
Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Running Gradle task 'assembleDebug'...                            140,6s
√ Built build\app\outputs\flutter-apk\app-debug.apk
Installing build\app\outputs\flutter-apk\app-debug.apk...           7,3s
D/FlutterGeolocator( 6792): Attaching Geolocator to activity
D/FlutterGeolocator( 6792): Creating service.
D/FlutterGeolocator( 6792): Binding to location service.
D/FlutterLocationService( 6792): Creating service.
D/FlutterLocationService( 6792): Binding to location service.
I/Choreographer( 6792): Skipped 50 frames!  The application may be doing too much work on its main thread.
D/FlutterGeolocator( 6792): Geolocator foreground service connected
D/FlutterGeolocator( 6792): Initializing Geolocator services
D/FlutterGeolocator( 6792): Flutter engine connected. Connected engine count 1
D/LocationPlugin( 6792): Service connected: ComponentInfo{com.user.app/com.lyokone.location.FlutterLocationService}
I/com.user.app( 6792): Compiler allocated 4533KB to compile void android.view.ViewRootImpl.performTraversals()
Syncing files to device sdk gphone x86 64...                       351ms

Flutter run key commands.
r Hot reload.
R Hot restart.
h List all available interactive commands.
d Detach (terminate "flutter run" but leave application running).
c Clear the screen
q Quit (terminate the application on the device).

A Dart VM Service on sdk gphone x86 64 is available at: http://127.0.0.1:57469/x9iwOdhhZZo=/
The Flutter DevTools debugger and profiler on sdk gphone x86 64 is available at: http://127.0.0.1:9102?uri=http://127.0.0.1:57469/x9iwOdhhZZo=/
W/Parcel  ( 6792): Expecting binder but got null!
D/TrafficStats( 6792): tagSocket(134) with statsTag=0xffffffff, statsUid=-1
D/ProfileInstaller( 6792): Installing profile for com.user.app
D/EGL_emulation( 6792): app_time_stats: avg=69.87ms min=7.59ms max=570.00ms count=21
D/EGL_emulation( 6792): app_time_stats: avg=77.98ms min=12.24ms max=894.28ms count=22
D/EGL_emulation( 6792): app_time_stats: avg=56.78ms min=24.47ms max=246.50ms count=18
D/EGL_emulation( 6792): app_time_stats: avg=18.72ms min=4.07ms max=75.93ms count=47
D/EGL_emulation( 6792): app_time_stats: avg=11.31ms min=3.95ms max=25.39ms count=57
D/EGL_emulation( 6792): app_time_stats: avg=14.98ms min=3.99ms max=88.47ms count=47
D/EGL_emulation( 6792): app_time_stats: avg=11.09ms min=3.76ms max=50.86ms count=54
D/EGL_emulation( 6792): app_time_stats: avg=13.98ms min=4.17ms max=47.56ms count=50
D/EGL_emulation( 6792): app_time_stats: avg=14.09ms min=4.34ms max=37.21ms count=49
D/EGL_emulation( 6792): app_time_stats: avg=8.97ms min=3.30ms max=29.70ms count=57

使用的依赖包：google_maps_flutter: ^2.5.0、flutter_map: ^7.0.2

解决方案

针对OpenStreetMap（flutter_map）不显示的问题，按以下步骤排查：

检查Tile Layer配置：确保flutter_map的TileLayer使用正确的瓦片地址和配置，示例代码如下：

FlutterMap(
  options: MapOptions(initialCenter: LatLng(51.509364, -0.128928), initialZoom: 10),
  children: [
    TileLayer(
      urlTemplate: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
      subdomains: const ['a', 'b', 'c'],
      userAgentPackageName: 'com.user.app', // 必须设置合法包名，避免被瓦片服务器拦截
    ),
  ],
)

若所在地区无法访问默认瓦片地址，可替换为国内可访问的瓦片源。

确认网络权限：检查android/app/src/main/AndroidManifest.xml中是否添加网络权限：
```
<uses-permission android:name="android.permission.INTERNET"/>
```
无此权限将无法加载网络瓦片。
设置组件尺寸约束：flutter_map必须有明确宽高，否则会被压缩为0导致不可见。用Expanded包裹组件，或设置SizedBox指定宽高：
```
Expanded(
  child: FlutterMap(
    // ... 配置内容
  ),
)
```
检查版本兼容性：flutter_map 7.0.2要求Flutter版本≥3.10，执行flutter doctor确认本地版本是否符合要求，版本过低则升级Flutter后重试。
排查模拟器网络问题：模拟器网络访问可能不稳定，尝试切换网络模式（如从Wi-Fi切换到蜂窝网络），或直接用真机测试，确认是否是模拟器网络导致瓦片加载失败。
验证切换逻辑：确认后端配置切换时，代码正确渲染flutter_map组件，而非错误加载未配置API密钥的Google Map（Google Map未配置密钥也会不显示）。

内容的提问来源于stack exchange，提问作者user22111293