html5使用js确定用户坐标位置
2017-04-10 10:24
375 查看
最近在微信平台开发时,涉及到的问题。如何获取用户当前坐标位置。
微信用户坐标定位的实现方案
1、使用微信的共享位置,获取用户坐标。缺点:可能会需要用户手动点击获取位置,体验不好。优点:坐标比较精准 且用户可以手动调整位置;
2、使用html5的获取地理位置方案。缺点:坐标不太精准,且部分手机的微信浏览器不支持html5。优点:不需用户太多参与。
3、使用百度地图的ip定位。缺点:坐标差距太大,建议直接舍弃。
我这里采用了第二种方案,但是在获取过程种发现有时候判断不准确。
原来代码
在我的理解中,手机要么支持该服务,要么不支持。但是在实际的测试过程中发现,部分手机并不能正确提示,也不能有效获取对应的坐标。于是在网上搜索原因。原因如下
部分国行Android手机“阉割”了谷歌GMS服务包,导致HTML5的geolocation无法使用wifi和基站定位服务导致。
这个时候就会发现,假如你的手机支持浏览器定位但是你没有打开相关服务或者该服务对应的组件有问题,上面的代码均不能正确的显示当前坐标。重新修改代码为
此时即可正常处理不同的业务了。
微信用户坐标定位的实现方案
1、使用微信的共享位置,获取用户坐标。缺点:可能会需要用户手动点击获取位置,体验不好。优点:坐标比较精准 且用户可以手动调整位置;
2、使用html5的获取地理位置方案。缺点:坐标不太精准,且部分手机的微信浏览器不支持html5。优点:不需用户太多参与。
3、使用百度地图的ip定位。缺点:坐标差距太大,建议直接舍弃。
我这里采用了第二种方案,但是在获取过程种发现有时候判断不准确。
原来代码
var isSupportGeolLoc = navigator.geolocation ? true : false; if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition); }else{ alert("你的手机不支持定位,现将转到自助设备列表页面!"); return; }
在我的理解中,手机要么支持该服务,要么不支持。但是在实际的测试过程中发现,部分手机并不能正确提示,也不能有效获取对应的坐标。于是在网上搜索原因。原因如下
部分国行Android手机“阉割”了谷歌GMS服务包,导致HTML5的geolocation无法使用wifi和基站定位服务导致。
这个时候就会发现,假如你的手机支持浏览器定位但是你没有打开相关服务或者该服务对应的组件有问题,上面的代码均不能正确的显示当前坐标。重新修改代码为
$(window).load(function() { //是否支持定位的参数 var isSupportGeolLoc = navigator.geolocation ? true : false; if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition,handleLocationError, {maximumAge:6000,timeout:5000, enableHighAccuracy:true} ); //navigator.geolocation.getCurrentPosition(showPosition); }else{ alert("你的手机不支持定位,现将转到自助设备列表页面!"); return; } }); function handleLocationError(error){ switch(error.code){ case error.TIMEOUT: alert("获取位置信息超时!"); break; case error.PERMISSION_DENIED: alert("您设置了阻止该页面获取位置信息!"); break; case error.POSITION_UNAVAILABLE: alert("浏览器无法确定您的位置!"); break; default: alert("获取位置信息出错!"); break; } }
此时即可正常处理不同的业务了。
相关文章推荐
- html5学习canvas基本使用:div在js前面;localStorage存储根据浏览器在不同的位置;应用程序缓存;placeholder 属性提供一种提示(hint),描述输入域所期待的值。
- js+html5获取用户地理位置信息并在Google地图上显示的方法
- Js - 判断用户是否上网(连接网络) - HTML5在线、离线online的使用
- Js - 判断用户是否上网(连接网络) - HTML5在线、离线online的使用
- HTML5 - 使用Geolocation(地理定位)获取用户的位置
- 使用js获取鼠标位置坐标
- 使用js判断用户输入日期的合法性
- 使用HTML5进行地理位置定位。误差在+-500m
- js使用confirm对用户的行为进行判断 和prompt
- JS获取area元素坐标和鼠标在页面中的位置
- Joomla!中如何使用switcher.js实现一个位置上div层的切换显示 【转】
- js获取控件坐标以及位置定位
- 屏幕取坐标程序-用于使用Robot类函数时的坐标确定
- ajax拖动层,保存层位置,这段代码是从网络人扒拉下来的(非XAJAX),使用类库prototype.js,感觉效果非常好
- 使用js函数实现的通过输入框中数据的长度来控制光标聚焦位置
- 实用的与坐标位置相关的js
- ajax拖动层,保存层位置,这段代码是从网络人扒拉下来的(非XAJAX),使用类库prototype.js,感觉效果非常好
- 确定照相坐标位置的照相机 gps 相机
- 用户VS2008使用EXT智能感知的js库
- js判断用户来路url(使用http header referer)