H5地理定位获取用户当前位置、城市
第一步:需要在百度地图开发者平台创建一个应用:http://lbsyun.baidu.com/apiconsole/key/create
配置信息

申请配置成功以后返回一个AK

第二步:引入百度地图的js脚本,地址为http://api.map.baidu.com/api?v=2.0&ak=(申请应用的AK)

第三步:通过BMap.Geolocation()和getCurrentPosition(function(){})函数进行定位操作,代码如下图
//获取当前城市
var geolocation=new BMap.Geolocation();
geolocation.getCurrentPosition(function(r){
if(this.getStatus()==BMAP_STATUS_SUCCESS){
var lat=r.address.lat//当前经度
var lng=r.address.lng//当前纬度
var province=r.address.province //返回当前省份
var city=r.address.city//返回当前城市
console.log(city)
$('.cityName').text(city)
}
})
H5地理定位获取用户当前位置、城市的更多相关文章
- 手机端网页使用html5地理定位获取位置失败的解决办法
网上有很多关于html5 geolocation 获取地理定位的方法,我试了下,只有在IE edge浏览器可以成功获取到,在chrome,firefox,手机端的safari,QQ浏览器,微信浏览器, ...
- 微信小程序:获取地理定位和显示相应的城市名称。
最近在看微信小程序,遇到地理定位显示城市名称的问题.本文就是记录这一过程. 解决方案 ...
- 获取用户当前位置信息的两种方法——H5、微信
在之前的 调用百度地图API的总结 中获取当前位置信息我用的是 H5 ,其实微信也提供了获取用户地理位置的方法,现将这两种方法都贴出来,看情况选择使用. 一.H5 获取当前地理位置得到经纬度 // H ...
- html5获取用户当前位置
支持地理定位的浏览器有IE9+.Firefox 3.5+ .Opera 10.6+ .Safari 5+ .Chrome.iOS 版Safari.Android版WebKit. navigator.g ...
- iOS下获取用户当前位置的信息
#import <MapKit/MKMapView.h> @interface ViewController (){ CLLocationManager *_currentLoaction ...
- HTML5 02. 多媒体控件、拖拽事件、历史记录、web存储、应用程序缓存、地理定位、网络状态
多媒体 video:是行内块(text-align: center; 对行内块适用) <figure></figure>: 多媒体标签 : <figcaption> ...
- 微信小程序之获取用户位置权限(拒绝后提醒)
微信小程序获取用户当前位置有三个方式: 1. wx.getLocation(多与wx.openLocation一起用) 获取当前的精度.纬度.速度.不需要授权.当type设置为gcj02 返回可用于w ...
- 基于浏览器的HTML5地理定位
基于浏览器的HTML5地理定位 地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML ...
- 使用navigator.geolocation来获取用户的地理位置信息
使用navigator.geolocation来获取用户的地理位置信息 W3C 中新添加了一个名为 Geolocation的 API 规范,Geoloaction API的作用就是通过浏览器获取用户的 ...
随机推荐
- php之新的开始---php的相关及其环境搭建
写在前面:首先,感谢“奇矩”给的这次机会,不论结果如何,我都会尽我最大的努力! 在今晚之前,如果说,我与php的接触是停留在知道的阶段,那今晚过后,我想我算是认识了php.php作为一门编程语言,已经 ...
- 【知识学习】Sublime Text 快捷键精华版
Sublime Text 快捷键精华版 Ctrl+Shift+P:打开命令面板 Ctrl+P:搜索项目中的文件 Ctrl+G:跳转到第几行 Ctrl+W:关闭当前打开文件 Ctrl+Shift+W:关 ...
- ES6-const定义常量
在es5中我们一般将变量名大写来表明这是一个常量,但其实它是可以修改的. 在es6中可以用const来定义常量,它定义的常量不能修改. const NAME = 'tom'; NAME ...
- UCS内存问题排查
UCS使用双列直插式内存模块(Dual In-line Memory Module (DIMM) )作为RAM模块. 根据文档介绍,主要有如下部分:1.Memory placement <内存放 ...
- WPS/office使用技巧系列
一 WPS中如果要对比2个文档,不想以标签形式打开而是以多窗口形式,该怎么操作? 点击WPS左上角的蓝色或绿色框-->选项->->视图->勾选在任务栏中显示所有窗口,恢复书签模 ...
- 洛谷 P1241 括号序列(栈)
嗯... 题目链接:https://www.luogu.org/problem/P1241 首先这道题是栈的入门题的加强版, 不仅要你判断这个括号序列是否合法,还要你将这个序列补充完整... 一开始是 ...
- vue.js ③
1.组件使用的细节点 H5编码中的规范是tr必须在tbody里所以不能直接套用<row></row>的写法,<ul>标签下支持<li>,select标签 ...
- requests 用法小速记
Request库安装方法 Request官网 使用管理员权限启动 command控制台(win+X 命令提示符(管理员)) 使用pip安装requests库(默认配置好python以及pip的环境变量 ...
- 2019年 我的phper之路,时光没了,头发还在
前言 曾经我认为最快的是麦迪的第一步,后来我觉得 7 酱逃跑速度更快,现在我懂了,原来我们都在跟时间赛跑. 年底了,给自己一个 "交代" 吧 2019 的我 2019 年写了 很多 ...
- 投资人分享答疑----HHR计划----以太直播课第三课
分享大纲:(祥峰投资) 一,投资人会看什么: 1,赛道定位:“生意”还是“独角兽-to be”? 2,如何退出?上市还是收购? 3, 团队能力,愿景力 4,壁垒:数据和价值 5,价格 二,融资需要准 ...