本篇教程探讨了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教程 如何获取当前位置的经纬度相关推荐

  1. html5获取当前坐标,HTML5教程 如何获取当前位置的经纬度

    本篇教程探讨了HTML5教程 如何获取当前位置的经纬度,希望阅读本篇文章以后大家有所收获,帮助大家HTML5+CSS3从入门到精通 . < 是想让地图的定位用户位置更准确一些. 查看了介绍: h ...

  2. android获取当前位置经纬度,Android中通过GPS或NetWork获取当前位置的经纬度

    今天在Android项目中要实现一个通过GPS或NetWork来获取当前移动终端设备的经纬度功能.要实现该功能要用到Android Framework 中的 LocationManager 类.下面我 ...

  3. html5经纬度定位 源码_基于浏览器的HTML5地理定位

    地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理和一个 ...

  4. html5经纬度定位 源码_利用HTML5定位功能获取经纬度,在根据经纬度利用百度地图获取位置信息...

    一.引入相关js 二.js代码 // 单次位置请求执行的函数 function getLocation(){ navigator.geolocation.getCurrentPosition(mapI ...

  5. html5经纬度定位 源码_h5实现获取用户地理定位的实例代码

    最近做的一个项目中有一个获取周围商户的功能,需要用到地理定位系统, 于是便想到了用 h5 的地理定位,查阅了下资料后,简单封装了下代码. const getPosition = ( timeout = ...

  6. html5响应式导航条,10个响应式设计的导航菜单源码-附教程

    10个响应式设计的导航菜单源码-附教程 Sponsor 在2013年里,响应式Web设计将会开始普及,我们应该学习这些新技术,尤其作为网页设计师和前端开发人员,学习CSS3样式表和HTML5是必不可少 ...

  7. 基于YOLOv7的室内场景智能识别系统(源码&教程)

    1.项目背景: 近年来,随着移动互联网与定位技术的发展,基于位置服务越来越多地出现在人们的日常生活中.虽然智能手机都包含很多基于位置服务的应用,但是传统的基于位置服务常常将服务范围划分为室内与室外两种 ...

  8. Python基于YOLOv7和CRNN的车牌分割&识别系统(源码&教程)

    1.研究背景 随着科技的进步和社会需求的增长,近年来摄像头逐渐高清化.高帧率化,摄像头作为信息获取设备的载体也不再局限于固定场景.路口.路侧.室内.高位.低位等不同场景下产生了各种对于检测识别的需求, ...

  9. 基于OpenCV的实时车道线分割&车道保持系统(源码&教程)

    1.研究背景 汽车主动安全系统能够实现风险的主动预防和规避,其能有力缓解当前我国汽车交通事故频发的困境,故对其的相关研究得到了国家的大力支持. 车道保持辅助系统(LKAS,Lane Keeping A ...

最新文章

  1. 数学理论—— 蒙特卡洛近似
  2. 让Dapper支持读写分离
  3. 一个几何级数的无限和思考
  4. Division CodeForces - 1445C(数论因子相关)
  5. 拖动卡顿_四招教你解决PS软件卡顿问题!
  6. 世界顶尖品牌的经典广告词欣赏
  7. 系统最小的服务最小的权限最大的安全。
  8. Objective-c的点符号(.)的奇怪之处
  9. Scribe+HDFS日志收集系统安装方法
  10. 框架 go_Go语言优秀应用开发框架 GoFrame
  11. 行泊ADAS摄像头前装搭载同比增长54.15%,TOP10供应商领跑
  12. 阿里旺旺在线图标,在线状态生成
  13. psd转html的素材,Ai转PSD格式完美保留图层脚本插件
  14. matlab动画制作详解
  15. 2.css字体 文本属性
  16. 2021年小米校招java编程题
  17. 红到发紫的人工智能,2019运势如何?
  18. std::thread介绍
  19. JAVA IO中read()方法的返回值
  20. 尼康D7100_认识机身上的控件

热门文章

  1. 记一次微信H5全屏播放视频的总结
  2. 关于降低锁的竞争程度------从奶爸的角度思考
  3. 个人练习-jq 鼠标移上移出查看图片(放大)提示
  4. smtp 邮件发送 附带ssl版本
  5. spring data redis的使用jar包版本冲突问题
  6. RHEL5.9下cacti监控的部署详解
  7. Elasticsearch 嵌套类型nested
  8. spark RDD的理解
  9. Nginx日志配置及分割
  10. 【USACO 1.3】Ski Course Design