您现在的位置: 开发 > Flutter插件 > 开发指南 > 地图Flutter插件 > 与地图交互

与地图交互 最后更新时间: 2021年01月22日

UI控件开关

AMapWidget属性中控件的开关项属性主要包括

 属性名称

 说明

 默认值

buildingsEnabled

是否显示3D建筑物

true

compassEnabled

是否指南针

false

scaleEnabled

比例尺是否显示

true

trafficEnabled

是否显示路况图层

false

labelsEnabled

是否显示底图文字

true

final AMapWidget map = AMapWidget(
      trafficEnabled: false,
      buildingsEnabled: true,
      compassEnabled: false,
      labelsEnabled: true,
      scaleEnabled: true,
    );

手势交互开关

AMapWidget属性中控件的手势交互开关项属性主要包括 

 属性名称

说明

默认值

 rotateGesturesEnabled

旋转手势

true

 scrollGesturesEnabled

滑动手势

true

 tiltGesturesEnabled

倾斜手势

true

 zoomGesturesEnabled

缩放手势

true

final AMapWidget map = AMapWidget(
      rotateGesturesEnabled:true,
      scrollGesturesEnabled: true,
      tiltGesturesEnabled: true,
      zoomGesturesEnabled: true
    );

改变地图视角

高德地图插件对于原生SDK改变地图视野的方法进行了封装并对外透出,插件修改视野需要通过AMapController对象进行,只需要调用moveCamera即可实现改变地图显示的区域(即改变地图中心点)、改变地图的缩放级别、改变地图的显示范围等。 

///AMapController中提供
///改变地图视角
///
///通过[CameraUpdate]对象设置新的中心点、缩放比例、放大缩小、显示区域等内容
///
///可选属性[animated]用于控制是否执行动画移动
///
///可选属性[duration]用于控制执行动画的时长
Future<void> moveCamera(CameraUpdate cameraUpdate,
      {bool animated, int duration}) 

实现功能由传入的CameraUpdate对象参数决定,这里简单介绍几种常见的,其他的参数请参考官网文档。

构造AMapWidget获取AMapController

要实现改变视野必须先获取AMapController对象,在AMapWidget的onCreate回调里可以拿到当前AMapWidget对应的AMapController。 

final AMapWidget map = AMapWidget(
  touchPoiEnabled:true,
  onMapCreated: _onMapCreated,
);

AMapController _controller;
void _onMapCreated(AMapController controller) {
      _controller = controller;
}
改变地图中心点

如果想改变地图中心点,可以通过如下方法构造改变地图中心点的 CameraUpdate参数: 

CameraUpdate.newCameraPosition(
      CameraPosition(
          //中心点
          target: LatLng(31.230378, 121.473658),
          //缩放级别
          zoom: 18,
          //俯仰角0°~45°(垂直与地图时为0)
          tilt: 30,
          //偏航角 0~360° (正北方为0)
          bearing: 0),
    );
改变地图的缩放级别

如果想改变地图的缩放级别,可以通过如下方法构造改变地图缩放级别的 CameraUpdate参数: 

CameraUpdate.zoomTo(18);

调用方法交互

AMapWidget的相关回调主要包括

 属性名称

 说明

onMapCreated

地图创建完成回调

成功后会返回AMapController对象

onCameraMove

地图移动回调

onCameraMoveEnd

地图移动结束回调 

onLocationChanged

位置变化回调 

onTap

点击地图回调 

onLongPress 

长按回调

onPoiTouched

poi点击回调 


final AMapWidget map = AMapWidget(
  touchPoiEnabled:true,
  onMapCreated: _onMapCreated,
  onLocationChanged: _onLocationChanged,
  onCameraMove: _onCameraMove,
  onCameraMoveEnd: _onCameraMoveEnd,
  onTap: _onMapTap,
  onLongPress: _onMapLongPress,
  onPoiTouched: _onMapPoiTouched,
);

AMapController _controller;
void _onMapCreated(AMapController controller) {
    setState(() {
      _controller = controller;
    });
}

void _onLocationChanged(AMapLocation location) {
    if (null == location) {
      return;
    }
    print('_onLocationChanged ${location.toJson()}');
 }

void _onCameraMove(CameraPosition cameraPosition) {
    if (null == cameraPosition) {
      return;
    }
    print('onCameraMove===> ${cameraPosition.toMap()}');
}

void _onCameraMoveEnd(CameraPosition cameraPosition) {
    if (null == cameraPosition) {
      return;
    }
    print('_onCameraMoveEnd===> ${cameraPosition.toMap()}');
}

void _onMapTap(LatLng latLng) {
    if (null == latLng) {
      return;
    }
    print('_onMapTap===> ${latLng.toJson()}');
}

void _onMapLongPress(LatLng latLng) {
    if (null == latLng) {
      return;
    }
    print('_onMapLongPress===> ${latLng.toJson()}');
}

void _onMapPoiTouched(AMapPoi poi) {
    if (null == poi) {
      return;
    }
    print('_onMapPoiTouched===> ${poi.toJson()}');
}

 当AMapWidget创建完成之后会通过onMapCreated回调透出AMapController对象,通过AMapController可以进行移动地图、截屏等操作。  

 方法名

 说明

Future<void> moveCamera(CameraUpdate cameraUpdate,

{bool animated, int duration})

移镜头地图视角

通过[CameraUpdate]对象设置新的中心点、缩放比例、放大缩小、显示区域等内容

可选属性[animated]用于控制是否执行动画移动

可选属性[duration]用于控制执行动画的时长

Future<void> setRenderFps(int fps) 

设置地图每秒渲染的帧数 

Future<Uint8List> takeSnapshot() 

地图截屏

Future<String> getMapContentApprovalNumber() 

获取地图审图号(普通地图)

任何使用高德地图API调用地图服务的应用必须在其应用中对外透出审图号

如高德地图在"关于"中体现

Future<String> getSatelliteImageApprovalNumber() 

获取地图审图号(卫星地图)

任何使用高德地图API调用地图服务的应用必须在其应用中对外透出审图号

如高德地图在"关于"中体现

Future<void> clearDisk() 

清空缓存 

final AMapWidget map = AMapWidget(
  touchPoiEnabled:true,
  onMapCreated: _onMapCreated,
);

AMapController _controller;
void _onMapCreated(AMapController controller) {
      _controller = controller;
}

///移动地图到首开广场
void _moveCamera() {
  _controller?.moveCamera(CameraUpdate.newCameraPosition(CameraPosition(
        target: LatLng(39.993306, 116.473004),
        zoom: 18,
        tilt: 30,
        bearing: 30)));
}

地图截屏功能

final imageBytes = await _mapController?.takeSnapshot();
setState(() {
  _imageBytes = imageBytes;
});


新用户
福利
示例
中心
常见
问题