如何在 Flutter 上使用 Google Maps 设置活动标记答案

【问题标题】：How do you set an active Marker with Google Maps on Flutter如何在 Flutter 上使用 Google Maps 设置活动标记
【发布时间】：2020-03-09 14:05:39
【问题描述】：

我的 Flutter 应用中有一个 GoogleMap。当页面加载时，它会调用 API 并获取我用来创建标记列表的地理位置列表。

我的 GoogleMap 使用了这个标记列表，它们显示得很好，但是，我希望其中一个处于活动状态。我在 API 文档中看不到任何说明这是可能的内容。我怎样才能做到这一点？

【问题讨论】：

主动标记是什么意思？
当您点击一个市场时，它会显示信息，并成为一个活跃的标记。我找不到只用代码实现的方法

标签： google-maps flutter dart

【解决方案1】：

与 here 和 here 相同的东西相关的颤振问题一直存在。

目前，通过官方地图 SDK 无法做到这一点。

但是，感谢社区，还有另一个分叉项目，它的实现可以帮助您实现这一目标。结帐this。

【讨论】：

【解决方案2】：

使用 GoogleMapController 将标记设置为活动状态，这里的 allMarkers 是可能来自数据库的标记列表，第一个（索引 0）将在执行以下操作后处于活动状态：

_googleMapController.showMarkerInfoWindow(allMarkers[0].markerId);

Documentation

【讨论】：

【解决方案3】：

您可以通过onTap 事件处理程序实现自定义活动状态。在有状态的小部件中创建状态以跟踪选定的标记并重建所有标记，并将它们的 ID 与突出显示的标记进行比较：

import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';

class GoogleMapsLabPage extends StatefulWidget {
  @override
  State<GoogleMapsLabPage> createState() => GoogleMapsLabPageState();
}

class GoogleMapsLabPageState extends State<GoogleMapsLabPage> {
  final preset = [
    {"id": "mountain-view", "lat": 37.421512, "lng": -122.084101},
    {"id": "san-bruno", "lat": 37.62816, "lng": -122.426491},
    {"id": "san-francisco", "lat": 37.789972, "lng": -122.390013},
    {"id": "sunnyvale", "lat": 37.403694, "lng": -122.031583}
  ];

  String _selectedOffice = '';

  List<Marker> _buildMarkers() {
    return preset.map((office) {
      return Marker(
          markerId: MarkerId(office['id']),
          position: LatLng(office['lat'], office['lng']),
          icon: office['id'] == _selectedOffice
              ? BitmapDescriptor.defaultMarkerWithHue(BitmapDescriptor.hueBlue)
              : BitmapDescriptor.defaultMarker,
          consumeTapEvents: true,
          onTap: () {
            setState(() {
              _selectedOffice = office['id'];
            });
          });
    });
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: GoogleMap(
        initialCameraPosition: CameraPosition(target: LatLng(37.7, -122.2), zoom: 9.0),
        markers: _buildMarkers().toSet(),
      ),
    );
  }
}

通过将consumeTapEvents 参数设置为true，我们可以通过将地图居中于标记并显示其信息窗口来禁用默认点击处理。

【讨论】：

【解决方案4】：

   mapController.addMarker(
  MarkerOptions(
    position: LatLng(your values here),
  ),
);

【讨论】：

最好解释一下您的代码 sn-p 正在做什么，以及为什么这意味着要回答 OP 的问题。