FlutterMap中Polygon添加数千点位时应用崩溃排查

核心原因 #

• Nominatim 拉取的伦敦市行政边界原始 GeoJSON 坐标量级普遍在1.5万~3万区间，直接全量解析后一次性塞给单个 Polygon 对象，会触发两个崩溃点：一是主线程同步做坐标转换+批量插入导致UI阻塞超时，二是 FlutterMap 默认 Polygon 绘制逻辑未对单多边形超3000点的场景做优化，绘制时内存峰值超过应用阈值直接闪退。
• 四层循环解析 GeoJSON 坐标的逻辑本身没有语法错误，问题出在没有做坐标抽稀、多边形拆分、异步加载处理，和已配置的 TileLayer、DragMarker 等基础组件无关。

可行修复方案 #

1. 坐标抽稀压缩点位规模 #

不要直接使用原始返回的全量高精度坐标，用道格拉斯-普克算法对坐标序列做抽稀简化，根据地图当前缩放级别动态调整抽稀精度：

• 缩放级别 < 10 时，抽稀阈值设为0.001（约100米精度），点位量可压缩到原始的10%~15%
• 缩放级别 10~14 时，抽稀阈值设为0.0001（约10米精度）
• 缩放级别 >14 时，再加载全量高精度坐标
  抽稀和坐标转换逻辑必须放到独立 Isolate 中执行，避免阻塞UI线程，参考实现：

// 启动独立isolate处理坐标解析和抽稀
Future<List<LatLng>> parseAndSimplifyGeoCoords(List rawGeoCoords, double simplifyTolerance) async {
  return compute(_isolateParseTask, (rawGeoCoords, simplifyTolerance));
}

List<LatLng> _isolateParseTask((List, double) taskParams) {
  final rawCoords = taskParams.$1;
  final tolerance = taskParams.$2;
  List<List<double>> flatCoordList = [];
  // 四层循环解析MultiPolygon结构的GeoJSON坐标
  for (final polygonGroup in rawCoords) {
    for (final singlePolygon in polygonGroup) {
      for (final coordRing in singlePolygon) {
        for (final point in coordRing) {
          // GeoJSON坐标顺序是[lng, lat]，转LatLng需要调换顺序
          flatCoordList.add([point[1], point[0]]);
        }
      }
    }
  }
  // 执行道格拉斯-普克抽稀
  final simplifiedCoords = DouglasPeucker.simplify(flatCoordList, tolerance: tolerance);
  return simplifiedCoords.map((coord) => LatLng(coord[0], coord[1])).toList();
}

2. 拆分超大多边形为多个子对象 #

FlutterMap PolygonLayer 对单个 Polygon 对象的点位最优承载上限是1000点以内，不要把所有点位都塞到同一个testPolygon里。把抽稀后的坐标列表按每800个点为一组，拆分为多个独立 Polygon 对象，所有子多边形设置完全一致的填充色、边框样式，视觉上和单个完整多边形没有区别，但绘制时的内存峰值可以降低80%以上。

3. 分帧加载点位替代一次性addAll #

不要在主线程一次性执行points.addAll全量插入，用分帧回调每帧加载固定数量点位，避免单次UI更新负载过高触发崩溃：

// 清空原有点位
testPolygon.points.clear();
int loadedIndex = 0;
const int perFrameLoadCount = 200;

void loadPointChunk() {
  if (loadedIndex >= fullPointList.length) return;
  final chunkEnd = (loadedIndex + perFrameLoadCount).clamp(0, fullPointList.length);
  testPolygon.points.addAll(fullPointList.sublist(loadedIndex, chunkEnd));
  loadedIndex = chunkEnd;
  // 下一帧继续加载
  WidgetsBinding.instance.addPostFrameCallback((_) => loadPointChunk());
}
// 启动分帧加载
loadPointChunk();

4. 关闭边界多边形的非必要交互 #

PolyEditor、DragMarker 类编辑插件默认会给每个多边形点位注册命中检测监听，千级点位同时注册监听会导致内存占用翻倍。对于行政边界这类不需要编辑的多边形，单独设置isInteractive: false跳过命中测试逻辑，渲染性能可以提升60%以上。

优化提示：行政边界多边形的边框宽度保持1px即可，粗边框的绘制性能开销是区域填充的3倍以上，1px边框完全可以达到OpenStreetMap官网的边界展示效果。

内容的提问来源于stack exchange，提问作者mohammad reza shabani