项目开发需要获取用户详细的地理位置信息,使用了高德地图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. 使用docker 部署graylog集群

    graylog 相比elk 有比较简单的方面,使用简单,配置简单,可视化工具是一体化的,比较方便 搭建使用docker,多主机部分,结合docker-compose 进行管理 具体docker 配置文 ...

  2. Java的序列化算法--解释序列后字节含义

    Java的序列化算法 序列化算法一般会按步骤做如下事情: ◆将对象实例相关的类元数据输出. ◆递归地输出类的超类描述直到不再有超类. ◆类元数据完了以后,开始从最顶层的超类开始输出对象实例的实际数据值 ...

  3. 代码规范 for node.js with 'npm-coding-style'

    npm-coding-style npm's "funny" coding style Description npm's coding style is a bit unconv ...

  4. SIM800/SIM900/SIM7000/SIM7600底层操作接口_句柄方式完全分离通信底层

    使用SIMCOM公司通信模块将底层的通信与应用完全进行了分离,便于移植. SIMCOM.h //定义了相关的结构体与类型. SIMCOM_AT.c//定义了底层的AT接口 SIMCOM_GSM.c// ...

  5. VS2017 Linux C++引用自定义的动态库

    前一篇博客讲了用系统库libpthread.so的例子,只需要在项目属性页的[C++->命令行参数]和[链接器->命令行参数]中加上对应参数(比如-pthread)即可,然后我试着引用自己 ...

  6. 智能家居入门DIY——【四、组合】

    前面几篇介绍了一些传感器和代码,这篇介绍一下把它们组合起来.之所以单独列出这部分,原因在于组合更多功能的时候发现使用软串口库驱动ESP8266时由于内存过小导致发送失败甚至整个系统无法工作的情况.所以 ...

  7. bzoj4542 大数

    Description 小 B 有一个很大的数 S,长度达到了 N 位:这个数可以看成是一个串,它可能有前导 0,例如00009312345.小B还有一个素数P.现在,小 B 提出了 M 个询问,每个 ...

  8. phpstorm破解 IntelliJ IDEA License Server本地搭建教程 http://blog.lanyus.com/archives/174.html/comment-page-6#comments 附件:mac环境

    ilanyu's Blog 搜索关键字搜索 首页IDEA注册码文件中转在线记事本老博客关于 IntelliJ IDEA License Server本地搭建教程 作者: ilanyu 时间: Marc ...

  9. Hive中创建结构体、数组以及map

    ROW FORMAT DELIMITED 分隔符设置开始语句 FIELDS TERMINATED BY:设置字段与字段之间的分隔符 COLLECTION ITEMS TERMINATED BY:设置一 ...

  10. Mongodb第一步资料

    学习的时候收集了部分好文章,这个文章主要收集的是下载,安装的基本资料 官方http://docs.mongodb.org/manual/tutorial/install-mongodb-on-wind ...