项目开发需要获取用户详细的地理位置信息，使用了高德地图API接口

1，注册高德地图开发者账号获取开发者Key

2，页面调用

<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.3&key=您申请的key值"></script>

3，示例代码

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

     <meta name="viewport" content="initial-scale=1.0, user-scalable=no">

     <title>获取地理位置</title>

     <style type="text/css">#iCenter{width:300px; height: 280px; border:1px #000 solid;margin:20px auto;}</style>

     <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.3&key=3df877a70685dac5ecb3afa375d4c305"></script>

 </head>

 <body>

 <div id="iCenter"></div>

 <script type="text/javascript">

     var mapObj = new AMap.Map('iCenter');

     mapObj.plugin('AMap.Geolocation', function () {

         geolocation = new AMap.Geolocation({

             enableHighAccuracy: true, // 是否使用高精度定位，默认:true

             timeout: 10000,           // 超过10秒后停止定位，默认：无穷大

             maximumAge: 0,            // 定位结果缓存0毫秒，默认：0

             convert: true,            // 自动偏移坐标，偏移后的坐标为高德坐标，默认：true

             showButton: true,         // 显示定位按钮，默认：true

             buttonPosition: 'LB',     // 定位按钮停靠位置，默认：'LB'，左下角

             buttonOffset: new AMap.Pixel(10, 20), // 定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)

             showMarker: true,         // 定位成功后在定位到的位置显示点标记，默认：true

             showCircle: true,         // 定位成功后用圆圈表示定位精度范围，默认：true

             panToLocation: true,      // 定位成功后将定位到的位置作为地图中心点，默认：true

             zoomToAccuracy:true       // 定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false

         });

         mapObj.addControl(geolocation);

         geolocation.getCurrentPosition();

         AMap.event.addListener(geolocation, 'complete', onComplete); // 返回定位信息

         AMap.event.addListener(geolocation, 'error', onError);       // 返回定位出错信息

     });

     function onComplete(obj){

         var res = '经纬度：' + obj.position +

                 '\n精度范围：' + obj.accuracy +

                 '米\n定位结果的来源：' + obj.location_type +

                 '\n状态信息：' + obj.info +

                 '\n地址：' + obj.formattedAddress +

                 '\n地址信息：' + JSON.stringify(obj.addressComponent, null, 4);

         alert(res);

     }

     function onError(obj) {

         alert(obj.info + '--' + obj.message);

         console.log(obj);

     }

 </script>

 </body>

 </html>

复制代码直接保存到html文件中，在手机端查看具体信息

手机端获取用户详细地理位置（高德地图API）的更多相关文章

  1. js获取用户当前地理位置（省、市、经纬度）

    在很多情况下,我们需要用到定位功能,来获取用户当前位置.当前比较流行的定位API有腾讯地图.百度地图.高德地图.搜狗地图等等,在这里我使用的是腾讯地图定位API,根据用户IP获取用户当前位置,API返 ...

  2. 如何获取用户的地理位置-浏览器地理位置(Geolocation)API 简介

    如何获取用户的地理位置-浏览器地理位置(Geolocation)API 简介 一.总结 一句话总结:Geolocation API(地理位置应用程序接口)提供了一个可以准确知道浏览器用户当前位置的方法 ...

  3. 使用navigator.geolocation来获取用户的地理位置信息

    使用navigator.geolocation来获取用户的地理位置信息 W3C 中新添加了一个名为 Geolocation的 API 规范,Geoloaction API的作用就是通过浏览器获取用户的 ...

  4. web网站如何获取用户的地理位置

    web网站如何获取用户的地理位置 一.总结 一句话总结:通过gps知道用户的经度和纬度,然后通过经度和纬度在在地图(google或者百度)上面显示位置. 1.html5如何通过gps知道用户的经度和纬 ...

  5. 解析高德地图api获取省市区，生成最新三级联动sql表

    前言: 最近项目中用到了全国省市区三级信息,但是网上找到的信息都是比较旧的信息.与现在最新的地区信息匹配不上.后来想到高德地图上可能有这些信息.所以解析了一下api接口,生成了相关省市区的sql信息. ...

  6. 钉钉开发入门,微应用识别用户身份,获取用户免登授权码code,获取用户userid,获取用户详细信息

    最近有个需求,在钉钉内,点击微应用,获取用户身份,根据获取到的用户身份去企业内部的用户中心做校验,校验通过,相关子系统直接登陆; 就是在获取这个用户身份的时候,网上的资料七零八落的,找的人烦躁的很,所 ...

  7. js获取用户实时地理位置

    js获取用户实时地理位置 if(navigator.geolocation) { var id = navigator.geolocation.watchPosition(function(posit ...

  8. 微信小程序-基于高德地图API实现天气组件(动态效果)

    微信小程序-基于高德地图API实现天气组件(动态效果) ​ 在社区翻腾了许久,没有找到合适的天气插件.迫不得已,只好借鉴互联网上的web项目,手动迁移到小程序中使用.现在分享到互联网社区中,帮助后续有 ...

  9. 【高德地图API】从零开始学高德JS API（七）——定位方式大揭秘

    原文:[高德地图API]从零开始学高德JS API(七)——定位方式大揭秘 摘要:关于定位,分为GPS定位和网络定位2种.GPS定位,精度较高,可达到10米,但室内不可用,且超级费电.网络定位,分为w ...

随机推荐

  1. ACdream区域赛指导赛之手速赛系列(2)

    版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/DaiHaoC83E15/article/details/26187183        回到作案现场 ...

  2. eclipse 3.7 中英文自由切换

    最近在学习Java的开发,然后又很多的资料是对于的英文环境讲解,有的资料是对应的中文环境讲解,所以很都对不上号,郁闷啊....... 而且开发的时候,每个人都使用习惯也不相同:有的人喜欢英文界面,有的 ...

  3. Spring bean作用域

    全当知识要点记录了,大家随意踩踩. spring的作用域有以下几种singleton作用域prototype作用域request作用域session作用域global-session作用域 1. si ...

  4. RK3288 device descriptor read/64, error -32

    CPU:RK3288 系统:Android 5.1 主板有两个USB接口,一个接USB摄像头,一个接身份证模块. 插入摄像头可以正常打开,再插入身份证模块时,摄像头就会卡主,而且身份证模块无法识别,内 ...

  5. erlang的一些系统限制修改

    atom个数限制 +t xxx 进程数限制 +P xxxx ets表个数限制 +e xxx ports个数限制 +Q xxxx 查看限制 string:tokens(binary_to_list(er ...

  6. PackedSyncPtr

    folly/PackedSyncPtr.h A highly specialized data structure consisting of a pointer, a 1-bit spin lock ...

  7. MySQL查询结果写入到文件总结

    Mysql查询结果导出/输出/写入到文件 方法一:直接执行命令: mysql> select count(1) from table into outfile '/tmp/test.txt'; ...

  8. 好记性不如烂笔头--linux学习笔记8关于nginx的动静分离

    动静分离逻辑梳理 就是给nginx配置访问规则,不同后缀的文件访问不同的目录 worker_processes 1; events { worker_connections 1024; } http ...

  9. Firemonkey MultiView

    MultiView 做导航用的. http://docwiki.embarcadero.com/RADStudio/Seattle/en/Mobile_Tutorial:_Using_a_MultiV ...

  10. FireDAC 汉字字段名称过滤

    [FireDAC][Stan][Eval]-107. Invalid character found [ 拼音码 like '%A%' ] 英文字段名称过滤正常 汉字字段名过滤报错. 莫非不支持汉字字 ...