Skip to content

基于高德官方flutter插件修改,支持导航,不喜勿喷,希望官方插件越做越好!

License

Notifications You must be signed in to change notification settings

suyie001/amap_flutter_map

This branch is 2 commits ahead of dmlzj/amap_flutter_map:master.

Folders and files

NameName
Last commit message
Last commit date

Latest commit

df71344 · Mar 30, 2021

History

38 Commits
Jan 28, 2021
Jan 21, 2021
Feb 5, 2021
Feb 5, 2021
Jan 22, 2021
Jan 21, 2021
Feb 2, 2021
Jan 21, 2021
Jan 21, 2021
Jan 21, 2021
Jan 21, 2021
Mar 8, 2021
Mar 30, 2021

Repository files navigation

amap_flutter_map

基于高德开放平台地图SDK的flutter插件,获取Flutter高德导航插件请入QQ群获取:731946579

Usage

  • 使用Flutter插件,请参考在Flutter里使用Packages, 添加amap_flutter_map的引用
  • 本插件在官方插件基础之上做了修改,若是不想使用不要用本仓库地址做为插件的地址

基于官方插件修改内容

  • 修改插件flutter要求版本: 1.20.0 到 1.17.2
  • 修改stream_transform插件版本:1.2.0 到0.0.18
  • 添加点聚合功能,实现点聚合

准备工作

基本使用示例

import 'package:amap_flutter_map_example/base_page.dart';
import 'package:flutter/material.dart';

import 'package:amap_flutter_map/amap_flutter_map.dart';
import 'package:amap_flutter_base/amap_flutter_base.dart';

class ShowMapPage extends BasePage {
  ShowMapPage(String title, String subTitle) : super(title, subTitle);
  @override
  Widget build(BuildContext context) {
    return _ShowMapPageBody();
  }
}

class _ShowMapPageBody extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _ShowMapPageState();
}

class _ShowMapPageState extends State<_ShowMapPageBody> {
  static final CameraPosition _kInitialPosition = const CameraPosition(
    target: LatLng(39.909187, 116.397451),
    zoom: 10.0,
  );
  List<Widget> _approvalNumberWidget = List<Widget>();
  @override
  Widget build(BuildContext context) {
    final AMapWidget map = AMapWidget(
      initialCameraPosition: _kInitialPosition,
      onMapCreated: onMapCreated,
    );

    return ConstrainedBox(
      constraints: BoxConstraints.expand(),
      child: Stack(
        alignment: Alignment.center,
        children: [
          Container(
            height: MediaQuery.of(context).size.height,
            width: MediaQuery.of(context).size.width,
            child: map,
          ),
          Positioned(
              right: 10,
              bottom: 15,
              child: Container(
                alignment: Alignment.centerLeft,
                child: Column(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: _approvalNumberWidget),
              ))
        ],
      ),
    );
  }

  AMapController _mapController;
  void onMapCreated(AMapController controller) {
    setState(() {
      _mapController = controller;
      getApprovalNumber();
    });
  }

  /// 获取审图号
  void getApprovalNumber() async {
    //普通地图审图号
    String mapContentApprovalNumber =
        await _mapController?.getMapContentApprovalNumber();
    //卫星地图审图号
    String satelliteImageApprovalNumber =
        await _mapController?.getSatelliteImageApprovalNumber();
    setState(() {
      if (null != mapContentApprovalNumber) {
        _approvalNumberWidget.add(Text(mapContentApprovalNumber));
      }
      if (null != satelliteImageApprovalNumber) {
        _approvalNumberWidget.add(Text(satelliteImageApprovalNumber));
      }
    });
    print('地图审图号(普通地图): $mapContentApprovalNumber');
    print('地图审图号(卫星地图): $satelliteImageApprovalNumber');
  }
}

点聚合使用示例:参考demo中的marker_add_with_map.dart文件即可

  • 聚合效果图如下: image
class MarkerAddWithMapPage extends BasePage {
  MarkerAddWithMapPage(String title, String subTitle) : super(title, subTitle);

  @override
  Widget build(BuildContext context) => _Body();
}

class _Body extends StatefulWidget {
  @override
  _BodyState createState() => _BodyState();
}

class _BodyState extends State<_Body> {
  static final LatLng mapCenter = const LatLng(39.909187, 116.397451);
  final Map<String, Marker> _initMarkerMap = <String, Marker>{};
  final Map<String, Cluster> _initClusterMap = <String, Cluster>{};

  @override
  Widget build(BuildContext context) {
    for (int i = 0; i < 10; i++) {
      LatLng position = LatLng(mapCenter.latitude + sin(i * pi / 12.0) / 20.0,
          mapCenter.longitude + cos(i * pi / 12.0) / 20.0);
      Marker marker = Marker(position: position);
      _initMarkerMap[marker.id] = marker;
      Map data = {"test": "test"};
      Cluster cluster = Cluster(position: position, data: jsonEncode(data));
      _initClusterMap[cluster.id] = cluster;
    }

    final AMapWidget amap = AMapWidget(
      apiKey: ConstConfig.amapApiKeys,
      markers: Set<Marker>.of(_initMarkerMap.values),
      clusters: Set<Cluster>.of(_initClusterMap.values),
      onClusterTap: (items) {
        print('==================\n');
        print(items);
      },
    );
    return Container(
      child: amap,
    );
  }
}

导航插件效果图

image image image image

插件使用注意问题:

插件依赖官方库:amap_flutter_base,记得引入

我使用插件时添加了点聚合功能,使用注意问题:

  • Cluster数据格式没做限制,解析的时候解析的是json,所以传值data必须是json字符串,否则运行崩溃
var data = {"shopid": item.shopid, "warning_num": item.warning_num};
       Cluster cluster = Cluster(
           position: LatLng(item.lat, item.lng), data: jsonEncode(data));
_initClusterMap[cluster.id] = cluster;

Android配置时尤其要注意,参考demo进行配置,否则会运行不起来,几个注意的地方:

  • 引入demo中高德sdk到flutter项目Android目录中:把example/android/app/libs 文件夹的都复制到 ##/android/app/libs 中
  • build.gradle配置:
android {
 ........

 buildTypes {
       release {
           ....
           //关闭混淆, 否则在运行release包后可能出现运行崩溃, TODO后续进行混淆配置
           minifyEnabled false //删除无用代码
           shrinkResources false //删除无用资源
       }
 }
 sourceSets {
       main {
           // 单独运行本插件必须使用,和导航插件共同使用时要注释掉
           jniLibs.srcDirs = ['libs']
       }
 }
}
dependencies {
   //demo中引入高德地图SDK
   // 单独运行本插件必须使用,和导航插件共同使用时要注释掉
   implementation fileTree(include: ['*.jar'], dir: 'libs')
}

已知问题:

  1. Flutter插件在iOS端,MapView销毁时,一定概率触发Main Thread Checker的报警, 经过对比测试确认是Flutter的bug所致;flutter/flutter#68490 (对比1.25.0-8.1.pre版本已修复,从github的issues中得知,有其它开发着反馈1.24.0-6.0.pre已修复;该问题依赖Flutter升级修复)

关于捐赠

如果您觉得有用,可以请我喝杯水!

微信 支付宝
image image

About

基于高德官方flutter插件修改,支持导航,不喜勿喷,希望官方插件越做越好!

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Dart 37.8%
  • Objective-C 32.5%
  • Java 28.8%
  • Ruby 0.9%