在颤动地图（openstreet）中制作搜索地址但无法将相机移动到标记位置

Question

所以问题很简单.. 当我使用地理编码或 pletora 设置搜索条件时，为什么我不能使用 mapcontroller 移动地图相机？有什么办法吗？

import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:geocoder/geocoder.dart';
import 'package:latlong/latlong.dart';
import 'package:parse_server_sdk_flutter/parse_server_sdk.dart';

class Maps extends StatefulWidget {
  @override
  _MapsState createState() => _MapsState();
}

class _MapsState extends State<Maps> {
  double long = 106.816666;
  double lat = -6.200000;
  double zoom = 15.0;
  double rotation = 0.0;
  LatLng point = LatLng(-6.200000, 106.816666);
  var location = [];
  MapController mapController;
  @override
  void initState() {
    super.initState();
    mapController = MapController();
  }

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        floatingActionButton: ElevatedButton(
          onPressed: () async {
            print(point);
            // ParseGeoPoint pts = await ParseGeoPoint(latitude: lat,longitude: long);
            // ParseObject data = await ParseObject('OrderIndividu')..set('AlamatG', pts);
            // await Navigator.pop(context);
          },
          child: Text('Save Alamat'),
        ),
        appBar: AppBar(
          title: Text('Map'),
          centerTitle: true,
        ),
        body: Stack(
          children: [
            FlutterMap(
              mapController: mapController,
              options: MapOptions(
                onTap: (p) async {
                  location = await Geocoder.local.findAddressesFromCoordinates(
                      new Coordinates(p.latitude, p.longitude));

                  setState(() {
                    long = p.longitude;
                    lat = p.latitude;
                    point = p;
                    print(p);
                    print(long);
                    print(lat);
                  });

                  print(
                      "${location.first.countryName} - ${location.first.featureName}");
                },
                center: LatLng(-6.200000, 106.816666),
                zoom: zoom,
              ),
              layers: [
                TileLayerOptions(
                    urlTemplate:
                    "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
                    subdomains: ['a', 'b', 'c']),
                MarkerLayerOptions(
                  markers: [
                    Marker(
                      width: 100.0,
                      height: 100.0,
                      point: point,
                      builder: (ctx) => Container(
                        child: Icon(
                          Icons.location_on,
                          color: Colors.red,
                        ),
                      ),
                    )
                  ],
                ),
              ],
            ),
            Padding(
              padding: EdgeInsets.symmetric(horizontal: 16.0, vertical: 34.0),

              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Card(
                    child: TextField(
                      onSubmitted: (val) async{
                        final query = val;
                        var addresses = await Geocoder.local.findAddressesFromQuery(query);
                        var first = addresses.first;
                        await mapController.moveAndRotate(LatLng(first.coordinates.latitude, first.coordinates.longitude), zoom, rotation);
                        setState(() {
                          long = first.coordinates.longitude;
                          lat = first.coordinates.latitude;
                          point = LatLng(first.coordinates.latitude, first.coordinates.longitude);
                        });
                        print("${first.featureName} : ${first.coordinates}");
                      },
                      decoration: InputDecoration(
                        contentPadding: EdgeInsets.all(16.0),
                        hintText: "Cari Alamat Anda",
                        prefixIcon: Icon(Icons.location_on_outlined),
                      ),
                    ),
                  ),
                  // Center(
                  //   child: Card(
                  //     child: Padding(
                  //       padding: const EdgeInsets.all(8.0),
                  //       child: Column(
                  //         children: [
                  //           Text("${location.first.featureName},${location.first.locality},${location.first.countryName}", style: TextStyle(fontSize: 16.0),),
                  //         ],
                  //       ),
                  //     ),
                  //   ),
                  // ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}

是否有任何代码可以让我将地图上的相机操作到标记位置？我不知道有什么功能可以做到这一点.. 甚至 mapcontroller 也不知道。所以有人可以帮助我吗？

Answer 1

我猜我找到了一种通过单击和在文本字段框上搜索映射的方法。它是使用 MapController.move(double LatLng, double zoom)

完成的

这是代码

body: Stack(
          children: [
            FlutterMap(
              mapController: mapController,
              options: MapOptions(
                controller: mapController,
                onTap: (p) async {
                  location = await Geocoder.local.findAddressesFromCoordinates(
                      new Coordinates(p.latitude, p.longitude));
                  setState(() {
                    long = p.longitude;
                    lat = p.latitude;
                    point = p;
                    mapController.move(LatLng(p.latitude, p.longitude), zoom);
                  });

                  print(
                      "${location.first.countryName} - ${location.first.featureName}");
                },
                center: point,
                zoom: zoom,
              ),
              layers: [
                TileLayerOptions(
                    urlTemplate:
                    "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
                    subdomains: ['a', 'b', 'c']),
                MarkerLayerOptions(
                  markers: [
                    Marker(
                      width: 100.0,
                      height: 100.0,
                      point: point,
                      builder: (ctx) => Container(
                        child: Icon(
                          Icons.location_on,
                          color: Colors.red,
                        ),
                      ),
                    )
                  ],
                ),
              ],
            ),
            Padding(
              padding: EdgeInsets.symmetric(horizontal: 16.0, vertical: 34.0),

              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Card(
                    child: TextField(
                      onSubmitted: (val) async{
                        final query = val;
                        var addresses = await Geocoder.local.findAddressesFromQuery(query);
                        var first = addresses.first;
                        setState(() {
                          long = first.coordinates.longitude;
                          lat = first.coordinates.latitude;
                          point = LatLng(first.coordinates.latitude, first.coordinates.longitude);
                          mapController.move(LatLng(first.coordinates.latitude, first.coordinates.longitude), zoom);
                        });
                        print("${first.featureName} : ${first.coordinates}");
                      },
                      decoration: InputDecoration(
                        contentPadding: EdgeInsets.all(16.0),
                        hintText: "Cari Alamat Anda",
                        prefixIcon: Icon(Icons.location_on_outlined),
                      ),
                    ),
                  ),
                  // Center(
                  //   child: Card(
                  //     child: Padding(
                  //       padding: const EdgeInsets.all(8.0),
                  //       child: Column(
                  //         children: [
                  //           Text("${location.first.featureName},${location.first.locality},${location.first.countryName}", style: TextStyle(fontSize: 16.0),),
                  //         ],
                  //       ),
                  //     ),
                  //   ),
                  // ),
                ],
              ),
            ),
          ],

在颤动地图（openstreet）中制作搜索地址但无法将相机移动到标记位置

making search addresses in flutter map (openstreet) but can't move the camera to marker location

widget

openstreetmap

flutter