居中所有标记和折线谷歌地图插件颤振适合屏幕
Posted
技术标签:
【中文标题】居中所有标记和折线谷歌地图插件颤振适合屏幕【英文标题】：Center all marker and poly line google maps plugin flutter fit to screen 【发布时间】：2019-11-05 00:08:50 【问题描述】：我想将所有标记放在地图中心，并根据设备大小调整缩放 下面是我所做的代码。 我正在使用 google_maps_flutter: ^0.5.18 开发一个基本的“多个标记” 谷歌地图类型的 Flutter 屏幕
-
最初设置为静态在添加标记（）函数中，
我将创建标记的地图并将其转换为设置，然后将其传递给谷歌地图小部件
import 'dart:async';
import 'dart:math';
import 'package:flutter/foundation.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:flutter_app/utils/AppConstants.dart';
import 'package:flutter_app/utils/AppDimens.dart';
import 'package:flutter_app/utils/CommonColors.dart';
import 'package:flutter_app/utils/CommonUtils.dart';
import 'package:flutter_app/utils/networ_util.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:permission_handler/permission_handler.dart';
import 'package:location/location.dart';
import 'package:screen/screen.dart';
class BusTrackingMap extends StatefulWidget
static String tag = "bus-tracking-page";
@override
State<StatefulWidget> createState()
// TODO: implement createState
return _BusTrackingMapState();
class _BusTrackingMapState extends State<BusTrackingMap>
with TickerProviderStateMixin
static String homeMarkerId = "101";
static String schoolMarkerId = "102";
static String driverMarkerId = "103";
static String polyLineId = "104";
String apiKey = "";
bool isFirstTimeCall = false, myLocationEnabled = true;
Timer timer;
/*map varibles*/
static LatLng schoolLatLong = new LatLng(23.027115, 72.552368);
static LatLng homeLatLong = new LatLng(23.023705, 72.538546);
static LatLng driverLatLong = new LatLng(23.024311, 72.548505);
Set<Marker> markerSet = new Set();
List<Marker> markerList = new List();
Map<MarkerId, Marker> markers = <MarkerId, Marker>;
Marker schoolMarker = new Marker(
markerId: new MarkerId(schoolMarkerId),
position: schoolLatLong,
infoWindow: InfoWindow(title: "Parents Location", snippet: ""),
icon: BitmapDescriptor.fromAsset("images/ic_school.png"));
Marker homeMarker = new Marker(
markerId: new MarkerId(homeMarkerId),
position: homeLatLong,
infoWindow: InfoWindow(title: "School Location", snippet: ""),
icon: BitmapDescriptor.fromAsset("images/ic_hhome.png"));
Marker driverMarker = new Marker(
markerId: new MarkerId(driverMarkerId),
position: driverLatLong,
infoWindow: InfoWindow(title: "Driver Location", snippet: ""),
icon: BitmapDescriptor.fromAsset("images/ic_bus.png"));
final Set<Polyline> polylineSet = new Set();
Polyline polyline;
List<LatLng> _latLongList = new List();
// LatLng driverLatLong=new LatLng(23.028712, 72.570227);
Completer<GoogleMapController> _controller = Completer();
GoogleMapController _mapController;
static CameraPosition _initialCamera = CameraPosition(
target: driverLatLong,
zoom: 14,
);
/*location update varible*/
BuildContext mContext;
CameraPosition _currentCameraPosition;
StreamSubscription<LocationData> _locationSubscription;
Location _locationService = new Location();
bool _permission = false;
String error;
LocationData _startLocation;
LocationData _currentLocation;
/*widget varibles*/
GoogleMap googleMap;
Scaffold scaffold;
BitmapDescriptor icon;
AnimationController rotationController;
@override
void initState()
// TODO: implement initState
super.initState();
rotationController = AnimationController(
duration: const Duration(milliseconds: 1000), vsync: this);
initPlatformState();
requestPermission();
addMarker();
addMarkerAndPolyLine();
refreshLocationDelay();
// apiCallEveryInterval();
keepPhoneWake() async
double brightness = await Screen.brightness;
Screen.setBrightness(0.5);
bool isKeptOn = await Screen.isKeptOn;
Screen.keepOn(true);
apiCallEveryInterval()
const oneSecond = const Duration(seconds: 20);
timer = new Timer.periodic(oneSecond, (Timer t) => fetchDriverLocation());
BitmapDescriptor.fromAssetImage(
ImageConfiguration(size: Size(48, 48)), "images/ic_hhome.png")
.then((onValue)
icon = onValue;
);
refreshLocationDelay()
rotationController.forward(from: 0.0);
var _duration = new Duration(seconds: 1);
return new Timer(_duration, refreshLocation);
void addMarker()
markers[schoolMarker.markerId] = schoolMarker;
markers[homeMarker.markerId] = homeMarker;
markers[driverMarker.markerId] = driverMarker;
markerSet = Set<Marker>.of(markers.values);
void addMarkerAndPolyLine()
String encode =
"msiCmnLmAG?b@?bCBRb@p@hBdCfCfDnAtA|BvAxF|DlDdCb@T^Z`Ax@XV^r@fAnB|BbE|@dAnZiX`GiFzAsA|AkAfBqAtBeBxCBn@g@b@SVCd@@d@J\Nr@^pAx@j@f@vBpBlCpCtAbB^^d@Z^L^Bd@CJAZvDPIDEl@y@N[t@_CdA_DbAyDt@AP[t@y@jCaCpCwBdAm@`@QfC_@jB[jOsBlEKlKIrA@l@dAx@fB`Ao@LI\En@GN@JA~@YhA_@ZSPOFIjE^nBLrBXbKlBfQfEjAb@`Af@~B`BtIxH~D|EtFjHnBoBjFaFhBiBTYZo@J[";
getRoutes();
NetworkUtil networkUtil = new NetworkUtil();
_latLongList = networkUtil.decodePolyline(encode);
polyline = new Polyline(
polylineId: PolylineId(polyLineId),
points: _latLongList,
color: CommonColors.primaryColor,
width: 10,
visible: true);
polylineSet.add(polyline);
void getRoutes()
if (!isFirstTimeCall)
NetworkUtil networkUtil = new NetworkUtil();
String url = "origin=" +
schoolLatLong.latitude.toString() +
"," +
schoolLatLong.longitude.toString() +
"&destination=" +
homeLatLong.latitude.toString() +
"," +
homeLatLong.longitude.toString() +
"&key=" +
apiKey;
networkUtil.get(url).then((latLongList)
_latLongList = latLongList;
);
isFirstTimeCall = true;
print("Locaton Updated");
@override
Widget build(BuildContext context)
buildView();
return scaffold;
void buildView()
final toolbar = new Row(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
InkWell(
onTap: ()
Navigator.pop(context);
,
child: Container(
alignment: Alignment.center,
height: 24,
width: 24,
margin: EdgeInsets.only(left: 0, right: 0),
padding: EdgeInsets.all(0),
child: Icon(
Icons.arrow_back_ios,
color: CommonColors.primaryColor,
),
)),
Container(
padding: EdgeInsets.only(left: 30, right: 5),
alignment: Alignment.centerLeft,
child: Material(
color: Colors.transparent,
child: Text(AppConstants.track_bus,
style: TextStyle(
fontFamily: AppConstants.FONT_FAMILY,
fontSize: AppDimens.appBarTitleSize,
fontWeight: FontWeight.w500,
color: CommonColors.primaryColor)),
),
)
],
);
googleMap = GoogleMap(
rotateGesturesEnabled: true,
scrollGesturesEnabled: true,
gestureRecognizers: Set()
..add(Factory<PanGestureRecognizer>(() => PanGestureRecognizer()))
..add(Factory<ScaleGestureRecognizer>(() => ScaleGestureRecognizer()))
..add(Factory<TapGestureRecognizer>(() => TapGestureRecognizer()))
..add(Factory<VerticalDragGestureRecognizer>(
() => VerticalDragGestureRecognizer())),
mapType: MapType.normal,
myLocationEnabled: myLocationEnabled,
myLocationButtonEnabled: true,
zoomGesturesEnabled: true,
markers: markerSet,
polylines: polylineSet,
minMaxZoomPreference: MinMaxZoomPreference.unbounded,
initialCameraPosition: _initialCamera,
onMapCreated: (GoogleMapController googleMapController)
_mapController=googleMapController;
_controller.complete(googleMapController);
,
);
final mapView = Container(
height: double.infinity,
width: MediaQuery.of(context).size.width,
child: googleMap,
);
scaffold = Scaffold(
appBar: AppBar(
title: toolbar,
backgroundColor: CommonColors.appBarColor,
automaticallyImplyLeading: false,
),
body: Builder(
builder: (BuildContext context)
mContext = context;
return mapView;
,
),
floatingActionButton: new Align(
alignment: Alignment.bottomRight,
child: new FloatingActionButton(
child: new Center(
child: RotationTransition(
turns:
Tween(begin: 0.0, end: 1.0).animate(rotationController),
child: Icon(
Icons.refresh,
color: Colors.white,
),
),
),
onPressed: ()
refreshLocation();
)),
);
/*update location and map*/
initPlatformState() async
await _locationService.changeSettings(
accuracy: LocationAccuracy.HIGH, interval: 1000);
LocationData location;
// Platform messages may fail, so we use a try/catch PlatformException.
try
bool serviceStatus = await _locationService.serviceEnabled();
// print("Service status: $serviceStatus");
if (serviceStatus)
_permission = await _locationService.requestPermission();
// print("Permission: $_permission");
if (_permission)
location = await _locationService.getLocation();
_locationSubscription = _locationService
.onLocationChanged()
.listen((LocationData result) async
_currentCameraPosition = CameraPosition(
target: LatLng(result.latitude, result.longitude), zoom: 14);
final GoogleMapController controller = await _controller.future;
controller.animateCamera(
CameraUpdate.newCameraPosition(_currentCameraPosition));
if (mounted)
setState(()
_currentLocation = result;
if (_currentCameraPosition != null)
_initialCamera = _currentCameraPosition;
);
);
else
bool serviceStatusResult = await _locationService.requestService();
// print("Service status activated after request: $serviceStatusResult");
if (serviceStatusResult)
initPlatformState();
catch (e)
// print(e);
if (e.code == 'PERMISSION_DENIED')
error = e.message;
else if (e.code == 'SERVICE_STATUS_ERROR')
error = e.message;
location = null;
setState(()
_startLocation = location;
);
dynamic refreshLocation() async
if (_locationSubscription != null)
_locationSubscription.cancel();
await _locationService.changeSettings(
accuracy: LocationAccuracy.BALANCED, interval: 1000);
_locationSubscription =
_locationService.onLocationChanged().listen((LocationData result)
print("SchoolEasy Location" + result.longitude.toString());
Scaffold.of(mContext).showSnackBar(SnackBar(
backgroundColor: Colors.blue,
content: new Text('Location Updated' + result.longitude.toString()),
));
homeMarker = new Marker(
markerId: new MarkerId(homeMarkerId),
position: LatLng(result.latitude, result.longitude),
icon: icon,
infoWindow:
InfoWindow(title: "ParentLocation Location", snippet: "snippets"),
);
if (mounted)
setState(()
_currentLocation = result;
// driverLatLong = new LatLng(result.latitude, result.longitude);
markers[homeMarker.markerId] = homeMarker;
markerSet = Set<Marker>.of(markers.values);
myLocationEnabled = false;
rotationController.stop(canceled: true);
if (_currentCameraPosition != null)
_initialCamera = _currentCameraPosition;
);
);
else
refreshLocationDelay();
/*location permission handling */
/*request permission if not allowed*/
Future requestPermission() async
// print("permission requested");
Map<PermissionGroup, PermissionStatus> permissions =
await PermissionHandler()
.requestPermissions([PermissionGroup.location]);
/*check location service status*/
/*Future<int> checkingServiceStatus() async
ServiceStatus serviceStatus =
await PermissionHandler().checkServiceStatus(PermissionGroup.location);
return serviceStatus.value;
Future<bool> requestRationalPermission() async
bool isShown = await PermissionHandler()
.shouldShowRequestPermissionRationale(PermissionGroup.location);
return isShown;
*/
Future<int> checkPermission() async
PermissionStatus permission = await PermissionHandler()
.checkPermissionStatus(PermissionGroup.location);
return permission.value;
dynamic fetchDriverLocation()
// print("location fetching");
@override
void dispose()
super.dispose();
if (timer != null)
timer.cancel();
【问题讨论】：
您需要输入一些代码，以便我们可以看到您在做什么以及您犯了哪些错误。 hi harunB10 我已经添加了代码，请提前告诉我可能的解决方案，谢谢 【参考方案1】：这对我来说很好。还为 max、min 函数导入 dart:math。
import 'dart:math';
LatLngBounds getBounds(List<Marker> markers)
var lngs = markers.map<double>((m) => m.position.longitude).toList();
var lats = markers.map<double>((m) => m.position.latitude).toList();
double topMost = lngs.reduce(max);
double leftMost = lats.reduce(min);
double rightMost = lats.reduce(max);
double bottomMost = lngs.reduce(min);
LatLngBounds bounds = LatLngBounds(
northeast: LatLng(rightMost, topMost),
southwest: LatLng(leftMost, bottomMost),
);
return bounds;
【讨论】：
以上是关于居中所有标记和折线谷歌地图插件颤振适合屏幕的主要内容，如果未能解决你的问题，请参考以下文章