web前端定位的经验
- 移动端
基本上用geolocation 就可以，定位用户的位置
HTML5 Geolocation API 用于获得用户的地理位置。
鉴于该特性可能侵犯用户的隐私，除非用户同意，否则用户位置信息是不可用的。
以下是简单的判断你的浏览器能不能使用geolocation 的代码
<!doctype html>
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
</body>
</html>
<script src="http://api.map.baidu.com/api?v=1.4" type="text/javascript"></script>
<script type="text/javascript">
function getLocation() {
var option={
enableHighAccuracy:true,
//值为boolen，顾名思义指是否允许高精度，默认false,因为一般应用不需要太高精度，而且耗时过长
maximumAge:1000
//应用接受新点位的时间
}
alert("this is getLocation()");
if (navigator.geolocation){
//支持
navigator.geolocation.getCurrentPosition(onSuccess,onError,option);
}else {
alert("浏览器不支持");
}
}
function onSuccess(position) {
// 返回用户位置
var longgitude=position.coords.longitude;//coords坐标
var latitude=position.coords.latitude;
alert('经度'+longgitude+"纬度"+latitude);
var map=new BMap.Map("allmap");
var point=new BMap.Point(longgitude,latitude);
var gc=new BMap.Geocoder();
gc.getLocation(point,function (rs) {
var addComp=rs.addressComponents;
alert(addComp.province+","+addComp.city);
//???
});
postData(longgitude,latitude);
}
//失败
function onError(error) {
switch (error.code){
case 1:
alert("位置服务被拒绝");
break;
case 2:
alert("暂时获取不到位置信息");
break;
case 3:
alert("获取信息超时");
break;
case 4:
alert("未知错误");
break;
}
var longitude=23.18333;
var latitude=113.42333;
postData(longitude,latitude);
}
//页面载入时请求获取当前地理位置
window.onload=function () {
getLocation();
}
</script>PC端
最方便的方法就是调用百度地图的API
1.登录注册后，找到百度地图JavaScript API
这是一套由JavaScript语言编写的应用程序接口，可帮助您在网站中构建功能丰富、交互性强的地图应用，支持PC端和移动端基于浏览器的地图应用开发，且支持HTML5特性的地图开发。免费对广大用户开放。
2.对于个人学习测试可以不用注册成为百度开发者，这有点麻烦我们忽略先，接下来看步骤3
3.
4.在html文件里调用就好了
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=你的ak"></script>其他功能跟调用具体就看看百度的官方文档实例啦 很好上手的，对照着实例DEMO练练吧
geolocation得到的经纬度是未经加密的，但是数值可能相对现有的地图类产品不够准确，而因为国内产品的经纬度基本都有加密，所以要转换成地图上相应位置最好直接用现成的API
- 在别的博主的文中，可以看到最简单的解决办法
本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
