ionic添加百度地图定位插件cordova-plugin-baidu-geolocation.git

最新推荐文章于 2024-04-24 09:35:01 发布

huzhenv5

最新推荐文章于 2024-04-24 09:35:01 发布

阅读量1.7k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： ionic 百度地图文章标签： ionic 百度地图定位插件

本文链接：https://blog.youkuaiyun.com/huzhenv5/article/details/77388010

ionic 同时被 2 个专栏收录

6 篇文章

订阅专栏

百度地图

1 篇文章

订阅专栏

该插件适合在ionic工程的js代码中直接调用定位功能（包括wifi、基站、GPS），返回指定坐标系的位置信息，支持位置追踪。
具体步骤如下：
1，如果电脑没有安装git，请先安装git，官方下载链接：
https://git-scm.com/download/win

2，进入ionic工程目录，执行以下指令：

cordova plugin add https://github.com/ETENG-OSP/cordova-plugin-baidu-geolocation.git --variable API_KEY=百度分配的AK --save

3，如果工程已经添加了安卓或者iOS的platform，分别移除之后再添加，如果还未添加platform则忽略。

ionic remove platform android
ionic remove platform ios
ionic add platform android
ionic add platform ios

4，在ionic工程中的config.xml文件中添加配置。

  <!-- android 使用本插件 -->
  <platform name="android">
    ......
    <plugin name="cordova-plugin-baidu-geolocation" spec="https://github.com/ETENG-OSP/cordova-plugin-baidu-geolocation">
      <variable name="API_KEY" value="百度分配的AK" />
    </plugin>
    ......
  </platform>

  <!-- iOS 使用官方插件 -->
  <platform name="ios">
    ......
    <plugin name="cordova-plugin-geolocation" spec="~1.0.0" />
    ......
  </platform>

关于百度地图的api_key，使用前需要在百度申请应用，获取 API_KEY。填错了的话仅能使用 GPS 定位，无法使用基站与 WIFI 定位。

5，在工程js代码中使用，直接贴代码：

if(navigator.geolocation) {
          navigator.geolocation.getCurrentPosition(function(position) {
            var point = new BMap.Point(position.coords.longitude, position.coords.latitude);
            if(ionic.Platform.isIOS()){
              //判断终端是否为IOS,如果是IOS则进行坐标转换(IOS返回的不是百度地图坐标系)
              var convertor = new BMap.Convertor();
              var pointArr = [];
              pointArr.push(point);
              convertor.translate(pointArr, 0, 5, function(data){
                if (data.status === 0) {
                  //获取到bd09ll坐标系坐标
                  var locationPoint = new BMap.Point(data.points[0].lng, data.points[0].lat);
                }
              });
            }else{
                //安卓直接获取的是bd09ll坐标系坐标，不需要转换

            }
          }, function(error) {
            //定位失败相关操作
          }, {
            coorType: 'bd09ll',
            maximumAge: 3000,
            timeout: 2000,
            enableHighAccuracy: true
          });
        }else {
          //无法使用navigator.geolocation定位相关操作
        }

关于配置项信息解释：

  coorType: 'bd09ll',         // 默认是 gcj02，可填 bd09ll 以获取百度经纬度用于访问百度 API
  maximumAge: 3000,         // 缓存时间
  timeout: 2000,            // 超时时间
  enableHighAccuracy: true  // 是否使用 GPS

6，如需要持续追踪用户位置：

navigator.geolocation.watchPosition(success, [error], [options]);

注意：如果你使用sdk23版本进行打包的，你就要注意了，在最新的android6.0上面，和以前的权限授权机制已经不同，如果使用23版本的进行打包，在android6.0以上的手机上运行不会给出获取地理位置权限的弹窗，务必改为23以下的版本进行编译

参考资料：
https://github.com/ETENG-OSP/cordova-plugin-baidu-geolocation/blob/master/README.md
http://blog.youkuaiyun.com/sean_css/article/details/52248190