Flutter。在Flutter應用中對谷歌地圖API進行Firebase實時更新

我正在開發一個基于谷歌地圖的flutter應用程式。在這個應用程式中應該發生的是，當用戶在地圖上添加一個標記時，它應該為所有用戶實時顯示該標記。在Firebase firestore中，標記將被保存為標記模型。因此，當一個新的模型被添加到firestore的集合中時，它應該更新所有的用戶地圖。 我曾試圖使用fluter Streambuilder來實作這一點。根據這個firebase檔案鏈接，我可以實時顯示來自firebase的所有檔案。 我使用這個鏈接來向地圖添加標記。

//this part is directly from firebase.flutter.dev official docs
class UserInformation extends StatefulWidget{
  @override
    _UserInformationState createState() => _UserInformationState()。
}

class _UserInformationState extends State< UserInformation> {
  final Stream<QuerySnapshot> _usersStream = FirebaseFirestore.instance.collection('users').snapshots()。

  @override
  Widget build(BuildContext context) {
    return StreamBuilder<QuerySnapshot> (
      流。_usersStream,
      builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
        if (snapshot.hasError) {
          return Text(' Something went wrong')。
        }

        if (snapshot.connectionState == ConnectionState.waiting) {
          return Text(" Loading");
        }

        return ListView(
          children: snapshot.data!.docs.map((DocumentSnapshot document) {
          Map<String, dynamic> data =document.data() ! as Map<String, dynamic> 。
            return ListTile(
              標題。Text(data['full_name'])。
              副標題。Text(data['company'])。
            );
          }).toList()。
        );
      },
    );
  }
}

根據下面的代碼，我試圖使用該邏輯來捕獲資料，并在我已經定義的一個集合中更新它。根據下面的代碼，如果該資料被捕獲，列印陳述句應該給出一個控制臺資訊。問題是，沒有控制臺資訊出現。我已經有一個用GoogleMap制作的單獨的應用程式，在那里我們可以設定標記并在firebase中更新這些標記。

 Completer<GoogleMapController> _controller = Completer();

  static final CameraPosition _kGooglePlex = CameraPosition(
    目標。LatLng(37.42796133580664, -122.085749655962),
    縮放。14.4746,
  );

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: StreamBuilder<QuerySnapshot>(
        流。FirebaseFirestore.instance.collection('markers').snapshots()。
        builder: (context, snapshot) {
          if (snapshot.hasError) {
            return Text(' Something went wrong')。
          }
          if (snapshot.connectionState == ConnectionState.waiting) {
            return Text(" Loading");
          }

          snapshot.data！.docs.map((DocumentSnapshot document) {
            print(document.toString())。
            Map<String, dynamic> data =
                document.data()! as Map<String, dynamic> 。
            MarkerModel model = MarkerModel(
                markerId: document.id。
                latitude: data['latitude']。
                longitude: data['longitude']。
                infoTitle: data['title']。
                infoSnippet: data['snippet']）。)
            Provider.of<MapScreenProvider>(context).addMarkerToSet（model）。
          });

          return Consumer<MapScreenProvider>(
            builder: (context, value, child) {
              return GoogleMap(
                markers: value.getMarkerSet,
                padding: EdgeInsets.all(35)。
                mapType: MapType.normal,
                onTap: (val) {
                  print(value.getMarkerSet.toString() )。
                },
                // onLongPress: (userPosition) async => await saveMarker(userPosition, context),
                initialCameraPosition。_kGooglePlex,
                onMapCreated: (GoogleMapController controller) =>
                    _controller.complete(controller)。
              );
            },
          );
        },
      ),
    );
  }

在地圖上添加標記，這些標記在地圖上的上傳是正常的。問題是，使用那個streambuilder來獲取實時檔案是不作業的。我使用streambuilder是因為檔案中提供了這個功能。如果有任何其他方法可以獲得谷歌地圖API的實時更新，可以在這種情況下使用，也請建議這些方法。

uj5u.com熱心網友回復：

你需要使用.forEach而不是.map。

snapshot.data! .docs.forEach((DocumentSnapshot document) {
  print（document.toString()）。
  Map<String, dynamic> data =
                document.data()! as Map<String, dynamic> 。
  MarkerModel model = MarkerModel(
    markerId: document.id。
    latitude: data['latitude']。
    longitude: data['longitude']。
    infoTitle: data['title']。
    infoSnippet: data['snippet']）。)
  Provider.of<MapScreenProvider>(context).addMarkerToSet（model）。
});

標籤：

上一篇：如何在Python中改變字典內部

下一篇：匹配一個形狀并使背景變白