HTML5 地理位置定位 API 接口开发

最新推荐文章于 2021-06-09 21:44:54 发布

weixin_34348111

最新推荐文章于 2021-06-09 21:44:54 发布

阅读量159

点赞数

文章标签： javascript python xhtml ViewUI

原文链接：https://my.oschina.net/mickelfeng/blog/839425

版权

2019独角兽企业重金招聘Python工程师标准>>>

地理位置定位的几种方式：IP地址，GPS，Wifi，GSM/CDMA

地理位置获取流程：
1、用户打开需要获取地理位置的web应用。
2、应用向浏览器请求地理位置，浏览器弹出询问，询问用户是否共享地理位置。
3、假设用户允许，浏览器从设别查询相关信息。
4、浏览器将相关信息发送到一个信任的位置服务器，服务器返回具体的地理位置。

HTML5地理地位的实现： 1. 实现基于浏览器（无需后端支持）获取用户的地理位置技术 2. 精确定位用户的地理位置( 精度最高达10m之内，依赖设备 ) 3. 持续追踪用户的地理位置 4. 与 Google Map、或者 Baidu Map 交互呈现位置信息。

HTML5中地理位置定位的方法

Geolocation API存在于navigator对象中，只包含3个方法：
1、getCurrentPosition //当前位置
2、watchPosition //监视位置
3、clearWatch //清除监视

getCurrentPosition(success,error,option)方法最多可以有三个参数：

第一个参数是成功获取位置信息的回调函数，它是方法唯一必须的参数；
第二个参数用于捕获获取位置信息出错的情况，
第三个参数是配置项。

******************************************获取自己当前的位置

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title>H5地理位置Demo</title>

          <script src="http://api.map.baidu.com/api?v=1.3" type="text/javascript">

          </script>

  

</head>
<body>
    <div  id="aaa" style="border:#ccc solid 1px" width:"697px" height:"500px"></div>
    <script type="text/javascript">
    if(navigator.geolocation)
    {

        navigator.geolocation.getCurrentPosition(function (p) {
            var latitude = p.coords.latitude//纬度
            var longitude = p.coords.longitude;
            createmap(latitude, longitude);

        }, function (e) {//错误信息
            var aa = e.code + "\n" + e.message;
            alert(aa);
        }
        );
    }
    function createmap(a,b)
    {

        var map = new BMap.Map("aaa");
        var point = new BMap.Point(b, a);
        map.centerAndZoom(point, 20);//设置地图的中心点和坐标
        Window.map = map;//将map变量存储在全局
    }

</script>
</body>
</html>

https://developer.mozilla.org/zh-CN/docs/Web/API/Geolocation/Using_geolocation

转载于:https://my.oschina.net/mickelfeng/blog/839425