9.4.2  在地图中显示当前的位置

9.4.2 在地图中显示当前的位置

在HTML 5网页中,可以先在页面中制作一幅地图,然后在页面中显示用户计算机或移动设备所在地的地图。在浏览器中打开案例页面时,浏览器会询问用户是否共享用户计算机或移动设备的地理位置信息。在不支持Geolocation API的浏览器中,打开浏览器时会显示错误提示信息。在支持Geolocation API的浏览器中,当浏览器询问用户是否共享用户计算机或移动设备的地理位置信息时,选择共享地理位置信息后,在浏览器中将会显示用户计算机或移动设备所在地的地图。

下面将通过一个实例讲解在网页地图中显示当前的位置的方法。

978-7-111-53392-4-Part03-149.jpg

在本实例页面中,用户单击监视位置更改按钮后,浏览器将会对用户的计算机或移动设备所在地进行监视,每隔一段时间检查用户的计算机或移动设备的地理位置是否发生改变。如果当前计算机或移动设备的地理位置发生改变则更新页面中的地图。用户单击停止监视按钮后会取消该监视。实例文件4.html的实现代码如下。

978-7-111-53392-4-Part03-150.jpg

978-7-111-53392-4-Part03-151.jpg

978-7-111-53392-4-Part03-152.jpg

执行效果如图9-7所示。

978-7-111-53392-4-Part03-153.jpg

图9-7 执行效果