首页 > 解决方案 > 更改相机位置时颤动谷歌地图不渲染

问题描述

我试图在底部显示一个Stack小部件,Google Map在顶部显示一个图标(汽车),这样汽车应该遵循由不同 GPS 坐标位置(纬度、经度)给出的道路上的路径。

为了模拟这一点,汽车图标始终绘制在堆栈的中心,谷歌地图使用以下方法移动到图标下方:

_mapController.animateCamera(CameraUpdate.newCameraPosition(
      CameraPosition(
        target: LatLng(
          newPosition.target.latitude,
          newPosition.target.longitude,
        ),
        zoom: 19,
      ),
    )); 

这是地图+图标的绘制:

Widget drawStack() {
    return Container(
        width: 930,
        height: 524,
        child: Stack(
          children: <Widget>[
            _buildGoogleMaps(),
            Align(
              alignment: Alignment.center,
              child: Image.asset("assets/images/carIconMap.png", width: 50, height: 93),
                  ),
                ],
              ),
            ),
          ],
        ));
  }

一开始一切正常,但随着给出更多坐标点,有一段时间(容器外部的部分),当相机移动时地图似乎没有加载。

我试图通过cameraTargetBoundsGoogleMap 构造函数的属性为地图提供最大和最小纬度、经度界限。

但似乎没有任何效果。

标签: google-mapsfluttergps

解决方案


这对我有用

 CameraPosition _initialPosition = CameraPosition(target: _latlng, zoom: 16);
 Position currentLocation;



_getLocation() async {
   currentLocation = await Geolocator()
       .getCurrentPosition(desiredAccuracy: LocationAccuracy.best);

   var newPosition = CameraPosition(
       target: LatLng(currentLocation.latitude, currentLocation.longitude),
       zoom: 16);

   CameraUpdate update =CameraUpdate.newCameraPosition(newPosition);
   CameraUpdate zoom = CameraUpdate.zoomTo(16);

   _mapController.moveCamera(update);      
 }

这是我的小部件

GoogleMap(
              onMapCreated: onMapCreated,
              initialCameraPosition: _initialPosition,
              myLocationEnabled: true,
              myLocationButtonEnabled: false,

            ),

推荐阅读