第8章 获取浏览器的地理位置信息(HTML5与CSS3 Web前端开发技术 知识).pptVIP

HTML5+CSS3 Web 前端开发技术 LOGO HTML5+CSS3 Web 前端开发技术 第8章 获取浏览器的地理位置信息 地理位置信息概述 1 地理位置信息使用过程 2 地理位置API 3 获取地理位置信息的应用 4 8.1 地理位置信息概述 1、地理位置信息的内容 浏览器的“位置信息”是指安装浏览器的硬件设备的位置信息，主要指设备当前地理位置的纬度(latitude)与当前地理位置的经度(longitude)信息。 表8-1 地理位置信息的属性及描述 属性 描述 latitude 当前地理位置的纬度信息 longitude 当前地理位置的经度信息 accuracy 经度和纬度的准确度，是监测的位置与实际位置的误差范围（以米为单位） altitude 当前地理位置的海拔高度(以米为单位) altitudeAccurancy 获取到的海拔高度的精度(以米为单位) heading 设备的前进方向，用面朝正北方向的顺时针旋转角度来表示 timestamp 获取地理位置信息的时间信息 8.1 地理位置信息概述 2、地理位置元信息的来源 （1）IP地址 （2）GPS （3）移动电话基站或无线Wi-Fi （4）用户输入 8.2 地理位置信息使用过程 （1）确定用户在Web应用中需要使用地理位置信息，例如，用户的地理位置，需要得到当前位置的海拔，移动时的方向等。 （2）调用Geolocation API，执行地理位置方法调用，得到需要的位置数据，如果使用地图，还需要使用Google的地图API、百度地图API、Bing 地图API等。 （3）浏览器解析用户的Geolocation API调用，并提示用户是否允许调用位置信息。 （4）浏览器检索运行Web应用设备的信息，得到括地理位置信息的元数据。 （5）为Web应用提供基于位置的服务，例如Web页面根据当前的位置设置显示的语言、从数据库中读取当前位置的天气信息、测试位置移动距和离速度等。 8.3 地理位置API HTML5的Geolocation API 包括3个方法：getCurrentPosition()、watchPosition()、clearWatch()。 1、getCurrentPosition()方法 getCurrentPosition()用来获取用户当前位置的地理信息。 void getCurrentPosition(onSuccess,onError, options); 第1个参数onSuccess 该参数是获取地理位置信息成功时的回调函数句柄。 第2个参数onError 这个参数是可选参数，是获取地理位置信息失败时的回调函数句柄。 第3个参数options options是可选参数，用来提供一个options对象给地理定位服务，通过一些可选属性的列表来指定搜集数据的选项，例如设置等候超时的时间。 8.4 获取地理位置信息的应用 2. 在getCurrentPosition()方法中进行错误处理 示例8-2和前一个例子基本类似，只是增加了错误处理函数showError()。 HTML5+CSS3 Web 前端开发技术 LOGO HTML5+CSS3 Web 前端开发技术 *