向地图添加图层/图块答案

【问题标题】：Add a layer/tile to the map向地图添加图层/图块
【发布时间】：2020-10-05 14:03:59
【问题描述】：

我正在使用 Mapbox 在 Flutter 中开展一个项目，我正在寻找一种将图层或图块导入我的地图的方法，例如这个示例（在 JS 中）： https://docs.mapbox.com/mapbox-gl-js/example/adjust-layer-opacity/

到目前为止，我可以显示地图：

import 'package:mapbox_gl/mapbox_gl.dart';

class MapsDemo extends StatelessWidget {

  static const String ACCESS_TOKEN = "...";
  MapboxMapController mapController;

  static const LatLng SOURCE_LOCATION = LatLng(0.0, 0.0);

  void _onMapCreated(MapboxMapController controller) {
    mapController = controller;
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
        body: MapboxMap(
      accessToken: MapsDemo.ACCESS_TOKEN,
      onMapCreated: _onMapCreated,
      initialCameraPosition: const CameraPosition(target: SOURCE_LOCATION),
    ));
  }
}

void main() {
  runApp(MaterialApp(home: MapsDemo()));
}

所以这是我的完整问题：有没有办法为给定位置获取 x*x 正方形（或 cicle）图层/图块，并将其显示在地图上的正确坐标处？

谢谢！

【问题讨论】：

标签： flutter mapbox layer

【解决方案1】：

最好的方法是按照 Akif 的建议使用 flutter_map： https://pub.dev/packages/flutter_map https://github.com/fleaflet/flutter_map

在他们的例子中，页面“overlay_image”完全符合我的要求。

【讨论】：

【解决方案2】：

我不确定 mapbox_gl 包是否支持图层，但有一个完整的包可以找到在地图上添加图层。也许你可以检查一下。

https://pub.dev/packages/flutter_map

编辑： MapboxMapController 中有两个方法。你可以使用它们。

Future<List> queryRenderedFeatures(
     Point<double> point, List<String> layerIds, List<Object> filter) async {
   return MapboxGlPlatform.getInstance(_id)
       .queryRenderedFeatures(point, layerIds, filter);
 }

 Future<List> queryRenderedFeaturesInRect(
     Rect rect, List<String> layerIds, String filter) async {
   return MapboxGlPlatform.getInstance(_id)
       .queryRenderedFeaturesInRect(rect, layerIds, filter);
 }

【讨论】：

很好，可以完成这项工作！知道如何使用它们吗？