相信所有的前端攻城狮都会碰到移动端App。里面获取用户定位信息。

那么问题来了，怎么获取用户的定位信息（经纬度）呢。

当然方法有很多，通过百度地图API 以及 高德地图 API都是可以的。但是两个获取的经纬度定位是有差距的。 差个几公里也是有可能的。

So:今天既然用的是Ionic框架 那么怎么能不用Cordova呢。用Cordova 的 Geolocation插件

1.先需要安装插件，在项目的根目录下运行命令

cordova plugin add cordova-plugin-geolocation

2.下载ng-cordova并在项目启动index.html中引入.注意需要在cordova.js文件前面引用

3.在自己的ionic项目的app.js文件里注入ngCordova

4.在自己需要调用的控制层调用

5.获取到GPS定位信息后（经纬度）需要先转化成百度地图的经纬度。然后用百度地图的经纬度再去调用百度地图的获取详细的信息（包括省市区街道）

6.APK运行效果

好了，谢谢大家。今天就废话到这里。希望对大家有所帮助！

ionic基于GPS定位并通过百度地图获取定位详细信息的更多相关文章

  1. Xamarin.Android 使用百度地图获取定位信息

    最近做一个项目,web端使用百度地图,PDA使用手持机自带的GPS定位系统获取经纬度,然后再百度地图上显示该经纬度会有一定距离的差异,这里就像可乐的瓶子拧上雪碧的盖子,能拧的上却不美观.所以为了数据的 ...

  2. 百度地图获取定位，实现拖动marker定位，返回具体的位置名

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  3. 在Fragment中实现百度地图，定位到当前位置（基于SDKv2.1.0）

    使用最新版本的百度地图需要注意的几个地方: 1.libs文件夹下要有android-support-v4.jar.baidumapapi_v2_1_0.jar.locSDK_3.1.jar三个jar包 ...

  4. AngularJS进阶(十九)在AngularJS应用中集成百度地图实现定位功能

    在AngularJS应用中集成百度地图实现定位功能 注:请点击此处进行充电! 前言 根据项目需求,需要实现手机定位功能,考虑到百度业务的强大能力,遂决定使用百度地图第三方服务. 添加第三方模块的步骤与 ...

  5. 利用HTML5定位功能，实现在百度地图上定位（转）

    原文:利用HTML5定位功能,实现在百度地图上定位 代码如下: 测试浏览器:ie11定位成功率100%,Safari定位成功率97%,(add by zhj :在手机上测试(用微信内置浏览器打开),无 ...

  6. 跨平台移动开发_PhoneGap 使用Geolocation基于所在地理位置坐标调用百度地图API

    使用Geolocation基于所在地理位置坐标调用百度地图API 效果图 示例代码 <!DOCTYPE html> <html> <head> <title& ...

  7. 手机端GPS定位结合百度地图实现定位

    html页面: <!DOCTYPE html>  <html>  <head>      <meta http-equiv="Content-Typ ...

  8. Android学习——百度地图开发定位与显示Demo

    百度地图给我们提供了很丰富的API供我们进行二次开发.百度地图的SDK与定位SDK在今年6月份进行了更新. 地图更新为3.0,定位更新为4.2.百度说:这次更新对接口有了较大部分的调整,与之前版本号不 ...

  9. 团队项目：安卓端用百度地图api定位显示跑道

    因为安卓调用api对我来说是一个完全陌生的领域,我在经过很长时间终于弄出来了,这段时间还是很有成效的,我得到了历练. 第一步:注册成为百度开发者 在百度地图开放平台创建应用.地址http://lbsy ...

随机推荐

  1. JWT使用

    原文链接:http://www.bleachlei.site/blog/2017/06/09/Nodejs-Expressjs-JWT%EF%BC%8CJWT%E4%BD%BF%E7%94%A8/ J ...

  2. 数据库运维平台~Yearning测试与总结

    一 部署   1 docker-compose up -d 即可非常方便   2 mysql安装   3 inception安装二 默认账号   默认用户admin 密码: Yearning_admi ...

  3. 【转载】Centos7修改root密码

    参考: https://blog.csdn.net/wcy00q/article/details/70570043 知道root密码,需要修改密码 以root登录系统输入passwd命令默认修改roo ...

  4. flask学习（一）

    特点: 短小精悍,可扩展性强 依赖wsgi:werkzurg werkzurg示例: from werkzeug.wrappers import Request, Response from werk ...

  5. Reinforcement Learning Solutions Ed2 Chapter 1 - 2 问题解答

    RL到了第三章题目多的不可思议 前两章比较简单,就在博客随便写写了.之后的用pdf更新. 1.1: Self-play will result different move even from the ...

  6. CentOS7.6搭建redis4.0.1 cluster集群

    1. 操作系统信息: $ uname -a Linux iZbp11d57wmumnwuihb2czZ -.el7.x86_64 # SMP Fri Feb :: UTC x86_64 x86_64 ...

  7. [Kubernetes]容器日志的收集与管理

    在开始这篇文章之前,首先要明确一点: Kubernetes 中对容器日志的处理方式,都叫做 cluster-level-logging ,也就是说,这个日志处理系统,与容器, Pod 以及 Node ...

  8. 使用scrapy爬虫,爬取17k小说网的案例-方法一

    无意间看到17小说网里面有一些小说小故事,于是决定用爬虫爬取下来自己看着玩,下图这个页面就是要爬取的来源. a 这个页面一共有125个标题,每个标题里面对应一个内容,如下图所示 下面直接看最核心spi ...

  9. 分组PARTITION BY及游标CURSOR的用法

    基础数据表: select * from dbo.RecommendationChanelVersionRelation: 数据如下: 要求按照ChannelVersionID分组,对每组中的Orde ...

  10. nginx+uwsgi+django开发环境搭建

    Nginx+uWSGI+Djangoi开发环境搭建 Django简介,环境搭建 uWSGI简介,安装与配置 Nginx安装与配置 Nginx+uWSGI+Django原理解析 1.django简介,环 ...