html5获取当前坐标,HTML5教程 如何获取当前位置的经纬度
本篇教程探讨了HTML5教程 如何获取当前位置的经纬度,希望阅读本篇文章以后大家有所收获,帮助大家HTML5+CSS3从入门到精通 。
<
是想让地图的定位用户位置更准确一些。
查看了介绍: http://www.w3school.com.cn/html5/html_5_geolocation.asp
看介绍中拿数据挺简单。
html>
点击这个按钮,获得您的坐标:
试一下
var x=document.getElementById("demo");
function getLocation()
{
if (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(showPosition);
}
else{x.innerHTML="Geolocation is not supported by this browser.";}
}
function showPosition(position)
{
x.innerHTML="Latitude: " + position.coords.latitude +
"
Longitude: " + position.coords.longitude;
}
正确点击按钮能拿到返回的经纬度
有个问题是: navigator.geolocation.getCurrentPosition(showPosition); 这个回调,有时有,有时没有 ,不稳定。 还有就是出来的经纬度弄到地图上,我了个去,跑到广州了。。。
--------------------------------------
本身百度地图api
ip定位: http://lbsyun.baidu.com/jsdemo.htm#i8_2 , 有点糙,显示的是城市名
浏览器定位: http://lbsyun.baidu.com/jsdemo.htm#i8_1 ,拿到经纬度展示,大概的。
百度有个 Geolocation, 打开上面的2个中一个,替换下
// 百度地图API功能
var map = new BMap.Map("allmap");
var point = new BMap.Point(116.331398,39.897445);
map.centerAndZoom(point,12);
var geolocation = new BMap.Geolocation(); //实例化浏览器定位对象。
//下面是getCurrentPosition方法。调用该对象的getCurrentPosition(),与HTML5不同的是,这个方法原型是getCurrentPosition(callback:function[, options: PositionOptions]),也就是说无论成功与否都执行回调函数1,第二个参数是关于位置的选项。 因此能否定位成功需要在回调函数1中自己判断。
geolocation.getCurrentPosition(function(r){ //定位结果对象会传递给r变量
if(this.getStatus() == BMAP_STATUS_SUCCESS){ //通过Geolocation类的getStatus()可以判断是否成功定位。
var mk = new BMap.Marker(r.point); //基于定位的这个点的点位创建marker
map.addOverlay(mk); //将marker作为覆盖物添加到map地图上
map.panTo(r.point); //将地图中心点移动到定位的这个点位置。注意是r.point而不是r对象。
alert(‘您的位置:‘+r.point.lng+‘,‘+r.point.lat); //r对象的point属性也是一个对象,这个对象的lng属性表示经度,lat属性表示纬度。
}
else {
alert(‘failed‘+this.getStatus());
}
},{enableHighAccuracy: true})
得到的是大致的经纬度,但城市是对的,位置有些偏差。
本文由职坐标整理并发布,希望对同学们有所帮助。了解更多详情请关注职坐标WEB前端HTML5/CSS3频道!
html5获取当前坐标,HTML5教程 如何获取当前位置的经纬度相关推荐
- html5获取gps坐标,html5获取手机GPS信息的示例代码
html5获取手机GPS信息的示例代码function getLocation() { if (navigator.geolocation) { navigator.geolocation.getCu ...
- html5 canvas 获取当前坐标,html5 canvas fillRect坐标和大小的问题解决方法
fillRect(100,100,100,100) 前2个100是指坐标,后2个100是指宽和高. 今天学习html5 的canvas,发现fillRect的坐标和大小一直不对,研究了半天,发现can ...
- 【扩展程序——猫抓1.0.15_网上的视频音频获取神器_安装教程加获取】
1.猫抓1.0.15 1.1,下载 声明:我这里用的是Google浏览器,其他的浏览器安装步骤不清楚.. 1.2,猫抓插件下载链接–提取码: 1111 1.3,打开Google浏览器,在页面的右上角点 ...
- html5经纬度定位 源码_HTML5教程 如何获取当前位置的经纬度
本篇教程探讨了HTML5教程 如何获取当前位置的经纬度,希望阅读本篇文章以后大家有所收获,帮助大家HTML5+CSS3从入门到精通 . < 是想让地图的定位用户位置更准确一些. 查看了介绍: h ...
- html5 图片文字提取,HTML5 Canvas:获取canvas内容-toDataURL()
我们可以通过canvas的toDataURL()方法来获取绘制在HTML5 canvas中的内容.做法类似下面的示例代码: var canvas = document.getElementById(& ...
- java 获取td_[Java教程]jQuery获取table表中的td标签
[Java教程]jQuery获取table表中的td标签 0 2017-07-28 00:00:08 首先我来介绍一下我遇到的问题 1.当有一个table表包含了 标签,标签,大致可以认为是这样的: ...
- 用js绘制html5数值曲线,Chart.js 教程绘制曲线图(Line chart)
Chart.js是一个简单.面向对象.为设计者和开发者准备的图表绘制工具库.它非常简单帮你展现各种数据的图表展现形式,我们今天看看如何引入和基本的操作,并用它绘制一个制曲线图(Line chart). ...
- html5 form表单,html5 教程
2019独角兽企业重金招聘Python工程师标准>>> html5 form表单 html5 教程 html5 form表单表单介绍 1.XHTML中需要放在form之中的诸如inp ...
- JAVA中经过nginx反向代理获取客户端ip并获取相关坐标等信息
关于搜狐新浪ip库查询接口的使用 直接输出访客ip及所在城市: <script src="http://pv.sohu.com/cityjson?ie=utf-8" > ...
最新文章
- pip install失败报错解决方案
- 绕过html标签,巧妙绕过WAF的XSS技巧
- 解决网页中不能复制文字的问题
- 一个使用Java BlockingQueue实现的生产者和消费者
- Java 分割、合并byte数组
- *【HDU - 2819】Swap(二分图匹配,输出路径)(待证明:是否是最少交换次数?)
- leetcode485. 最大连续1的个数 *py:“又是一行就解决了,没意思”
- Win10 20H2正式发布,对比旧版新功能一览
- C语言 signal
- 项目管理中工时计算的问题
- 解题:POI 2008 Station
- 计算机日常知识试题,计算机基础知识及日常维护测试题
- VS2010_x86_编译错误
- 使用IntelliJ IDEA和Maven构建Java web项目并打包部署
- editplus使用php,EditPlus配置PHP调试环境详细图文介绍
- 边界值法中的上点、内点和离点分析
- Cisco 思科模拟器命令
- 关于创建String对象的抉择
- C语言中宏定义函数的运算优先级问题
- Unity多屏幕设置细节
热门文章
- 陕西中小企业促进局 e-mail_重点注意2020陕西工程师职称评审破格指南
- 组态王中时间存access怎么存,组态王通过Access数据库起始截止日期查询方法
- access期刊可以重投几次_又被拒稿了?老司机带你一投即中
- 【S操作】一个简单粗暴易用的远程调试方案——OTA http update
- Python字符串、时间戳、datetime时间相关转换
- 自学Zabbix3.0版本以上资产清单inventory
- hibernate基本映射文件
- ios开发中,User Defined Runtime Attributes的应用
- Oracle数据表和Constraint管理
- 负载均衡故障诊断:一个MSS值引发的疑案