如何使用HTML5地理位置定位功能?


当前第2页 返回上一页

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

locationSuccess: function(position){

    var coords = position.coords;   

    var latlng = new google.maps.LatLng(

        // 维度

        coords.latitude,

        // 精度

        coords.longitude

    ); 

    var myOptions = { 

        // 地图放大倍数 

        zoom: 12, 

        // 地图中心设为指定坐标点 

        center: latlng, 

        // 地图类型 

        mapTypeId: google.maps.MapTypeId.ROADMAP 

    }; 

    // 创建地图并输出到页面 

    var myMap = new google.maps.Map( 

        document.getElementById("map"),myOptions 

    ); 

    // 创建标记 

    var marker = new google.maps.Marker({ 

        // 标注指定的经纬度坐标点 

        position: latlng, 

        // 指定用于标注的地图 

        map: myMap

    });

    //创建标注窗口 

    var infowindow = new google.maps.InfoWindow({ 

        content:"您在这里<br/>纬度:"

            coords.latitude+ 

            "<br/>经度:"+coords.longitude 

    }); 

    //打开标注窗口 

    infowindow.open(myMap,marker);

}

  经过测试,Chrome/Firefox/Safari/Opera四个浏览器获取到的位置信息都是一摸一样的,估计都是用的同一个位置服务,数据如下:

  而IE浏览器的和上面几款浏览器获取到的数据不一样,数据如下:

  位置服务用于估计您所在位置的本地网络信息包括:有关可见 WiFi 接入点的信息(包括信号强度)、有关您本地路由器的信息、您计算机的 IP 地址。位置服务的准确度和覆盖范围因位置不同而异。 

  总的来说,在PC的浏览器中 HTML5 的地理位置功能获取的位置精度不够高,如果借助这个 HTML5 特性做一个城市天气预报是绰绰有余,但如果是做一个地图应用,那误差还是太大了。不过,如果是移动设备上的 HTML5 应用,可以通过设置 enableHighAcuracy 参数为 true,调用设备的 GPS 定位来获取高精度的地理位置信息。

以上就是如何使用HTML5地理位置定位功能?的详细内容,更多文章请关注木庄网络博客

返回前面的内容

相关阅读 >>

分享几款炫酷的HTML5实现的图片特效

断点续传原理是什么?怎么利用HTML5实现文件断点续传

移动端h5页面尺寸大小

关于HTML5 canvas的事件处理

html代码什么意思?

如何使用HTML5 canvas绘制一个矩形

canvas图片跨域会遇到的问题及解决方法总结

HTML5 canvas绘制时指定颜色与透明度的方法

javascript中比较运算符隐式类型转换的介绍(附示例)

图文详解如何用canvas画实心圆和空心圆

更多相关阅读请进入《HTML5》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...