html5地图定位教程,获取地理位置接口

　　地理位置的几种方式：IP地址、GPS、Wifi、GSM/CDMA地理位置获取流程:

　　1.用户打开需要获取地理位置的web应用程序。

　　2.应用程序向浏览器请求地理位置，浏览器弹出一个询问，询问用户是否共享该地理位置。

　　3.如果用户允许，浏览器可以从不同的设置中查询相关信息。

　　4.浏览器向可信位置服务器发送相关信息，服务器返回具体的地理位置。HTML5地理地位的实现:

　　1.实现基于浏览器获取用户地理位置的技术(无后端支持)。

　　2.精确定位用户的地理位置(精确度高达10m，视设备而定)

　　3.跟踪用户的地理位置。

　　4.与谷歌地图或百度地图互动，呈现位置信息

　　地理位置API用于将用户当前的地理位置信息共享给可信站点，这涉及到用户的隐私和安全。因此，当一个网站需要获取用户当前的地理位置时，浏览器会提示用户“允许”或“拒绝”。

　　我们先来看看哪些浏览器支持地理位置API:

　　IE9.0、FF3.5、Safari5.0、Chrome5.0、Opera10.6、IPhone3.0、Android2.0

　　Geolocation API存在于navigator对象中，只包含三种方法：复制代码代码如下：

　　1.getCurrentPosition //当前位置

　　2.观察位置//监控位置

　　3.clearWatch //清除监控

　　navigator . geolocation . getcurrentposition(…，function(error){

　　开关(错误代码){

　　大小写错误。超时：

　　Alert(连接超时，请重试)；

　　打破；

　　大小写错误。权限被拒绝：

　　Alert(您拒绝使用位置共享服务，查询被取消)；

　　打破；

　　大小写错误。职位_不可用：

　　Alert(，抱歉，暂时无法为你的星球提供位置服务)；

　　打破；

　　}

　　});

　　WatchPosition就像一个与clearWatch配对的追踪器。

　　WatchPosition和clearWatch有点像setInterval和clearInterval。

　　var watchPositionId=navigator . geolocation . watch position(success _ callback，error_callback，options)；

　　navigator . geolocation . clear watch(watch position id)；

　　HTML 5提供了地理位置等一系列API供用户使用，方便用户制作LBS地理应用。首先，在支持HTML 5的浏览器中，API打开时会询问用户是否同意使用该API，否则不会打开以保证安全。1、开启，判断是否浏览器支持LBS api复制代码代码如下：

　　函数isGeolocationAPIAvailable()

　　{

　　var location=不，此浏览器不支持地理定位；

　　if(window . navigator . geolocation){

　　location=是的，此浏览器支持地理定位。；

　　}

　　警报(位置)；

　　}

　　在上面的示例中，异常是在displayError方法中捕获的。2、获得用户的地理位置

　　这个getCurrentPosition没问题；复制代码如下：

　　函数requestPosition() {

　　if (nav==null) {

　　nav=window.navigator

　　}

　　如果(导航！=null) {

　　var geoloc=nav.geolocation

　　如果(geolocal！=null) {

　　geoloca . getcurrentposition(success callback)；

　　}

　　否则{

　　警报(“您的浏览器不支持地理位置API”)；

　　}

　　}

　　否则{

　　alert(“未找到导航器”)；

　　}

　　}

　　当成功获取地理位置时，将生成一个回调方法，并处理返回的结果。复制代码如下：

　　函数setLocation(val，e) {

　　document.getElementById(e)。value=val

　　}

　　函数成功回调(位置)

　　{

　　set location(position . coords . latitude，纬度)；set location(position . coords . longitude，经度)；

　　}3、一个很常见的问题，是如何跟踪用户不断变化的地理位置，这里小结下其中用到的两个api

　　1个观察位置

　　示例：按如下方式复制代码：

　　函数listenForPositionUpdates() {

　　if (nav==null) {

　　nav=window.navigator

　　}

　　如果(导航！=null) {

　　var geoloc=nav.geolocation

　　如果(geolocal！=null) {

　　watch id=geoloc . watch position(success callback)；

　　}否则{

　　警报(“您的浏览器不支持地理位置API”)；

　　}

　　}否则{

　　alert(“未找到导航器”)；

　　}

　　}

　　然后，在successCallback中，您可以设置显示最新的地理位置：复制如下代码：

　　函数成功回调(位置){

　　setText(位置。坐标。纬度，”纬度);setText(位置。坐标。经度经度);

　　}

　　如果不希望实时跟踪，则可以取消之：

　　函数clearWatch(watchID) {

　　窗户。领航员。地理定位。清除手表(手表id)；

　　}4、如何处理异常

　　当遇到异常时，可以捕捉之：复制代码代码如下：

　　如果(地理位置！=null) {

　　地理位置。getcurrentposition(成功回调，错误回调)；

　　}

　　函数错误回调（错误){

　　var message=

　　开关（错误代码){

　　大小写错误。权限被拒绝：

　　消息=该网站没有使用权限

　　地理位置API ；

　　打破；

　　大小写错误。职位_不可用：

　　消息=无法确定当前位置。;

　　打破；

　　大小写错误。权限被拒绝超时：

　　消息="无法确定当前位置"

　　在指定的超时期限内。

　　打破；

　　}

　　if (message==) {

　　var strErrorCode=错误。代码。tostring()；

　　消息=位置无法确定，原因是

　　未知错误（代码：" strErrorCode ").";

　　}

　　警报（消息);

　　}5、 在google 地图上显示位置（前提是有google map api等设置好）复制代码代码如下：

　　函数getCurrentLocation()

　　{

　　if (navigator.geolocation)

　　{

　　领航员。地理定位。getcurrentposition(显示我的位置，显示错误)；

　　}

　　其他

　　{

　　警报(不，此浏览器不支持地理定位 API .);

　　}

　　}

　　函数显示我的位置(位置)

　　{

　　var坐标=position.coords。纬度，位置。坐标。经度；

　　var map _ URL= http://地图。谷歌API。com/maps/API/静态地图？中心=

　　坐标”zoom=14 size=300 x300 sensor=false”；

　　文档。getelementbyid(“谷歌地图”).innerHTML= img src= map _ URL /；

　　}

　　函数显示错误（错误)

　　{

　　开关（错误代码)

　　{

　　大小写错误。权限被拒绝：

　　警报("此网站无权使用地理定位API”)

　　打破；

　　大小写错误。职位_不可用：

　　警报(无法确定当前位置。)

　　打破；

　　大小写错误。超时：

　　警报(在指定的超时期限内无法确定当前位置。)

　　打破；

　　大小写错误。未知错误：

　　警报(由于未知错误，无法确定位置。)

　　打破；

　　}

　　}

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。