HTML5的Geolocation地理位置定位API使用教程

2020-04-21 23:17:01易采站长站整理

JavaScript Code复制内容到剪贴板

watchId = navigator.geolocation.watchPosition(success[, error[, options]]);  

watchPosition方法的使用方式和getCurrentPosition类似,不同的是,success函数会执行多次,一旦获取到最新的位置数据,success函数就会被触发,与之相似地,如果连续获取最新的数据失败时,error函数也会被执行多次。
大家或许会注意到,上面的函数签名中,会返回一个watchId,它标示着当前的watch操作,当我们位置跟踪任务完成后,可以使用clearWatch函数将这个watchId清除即可:

JavaScript Code复制内容到剪贴板

navigator.geolocation.clearWatch(watchId);  

上面就是Geolocation的常用的三个API,日常开发中我们可根据实际情况选用合适的方法,进而获取用户的位置信息。
现在大部分浏览器都已支持Geolocation了,可是为了兼容低版本的浏览器,我们需要判断它的支持情况:

JavaScript Code复制内容到剪贴板

if (‘geolocation’ in navigator) {   
  // getting usr’s position   
} else {   
  // tips: your position is not available   
}  

最后,我们用一个简单的例子来演示在开发中是如何使用Geolocation的:

JavaScript Code复制内容到剪贴板

var API = {   
    //get recommended data by current longitude and latitude   
    getSurroundingRecommendations: function(longitude, latitude, callback) {   
        //simulate data obtaining from server.   
        setTimeout(function() {   
            var data = [   
                {   
                    //item   
                },   
                {   
                    //item   
                }   
            ];