问题描述
所以问题很简单..当我使用地理编码或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。所以有人可以帮助我吗?
解决方法
我想我找到了一种通过单击和文本字段框来搜索映射的方法。它是使用 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),// ],// ),// ),// ),// ),