LayaAir Geolocation 获取地理位置

川长思鸟来 2022-04-10 02:29 389阅读 0赞

# Geolocation #

1、如果设备支持 Geolocation(地理定位)，并且所使用的浏览器支持，就可以使用 Geolocation 获取设备的当前地理位置。可以打开网页[http://caniuse.com/\#search=geolocation][http_caniuse.com_search_geolocation] 查看有哪些浏览器版本支持Geolocation。

2、LayaAir 的 [Geolocation ][Geolocation]是对 《[HTML5 Geolocation（地理定位）][HTML5 Geolocation]》的封装，同理实际中支持在移动设备上使用，在 PC 端基本获取不到数据。

3、使用静态方法 Geolocation.getCurrentPosition() 获取当前的位置，getCurrentPosition() 只触发一次，其中支持两个回调函数，分别是获取位置信息成功时，以及获取位置信息失败时。

4、getCurrentPosition 获取当前的位置成功时，回调函数返回 [GeolocationInfo ][GeolocationInfo]对象，包含以下信息：

> latitude —— 纬度（度）。  
> longitude —— 经度（度）。  
> altitude —— 相对于海平面的海拔高度（米）。如果设备不提供海拔数据，altitude 的值为null。  
> accuracy —— 返回经纬度的精度，以米为单位。  
> altitudeAccuracy —— 返回海拔的精度，以米为单位。altitudeAccuracy 可能为null。  
> heading —— 返回设备的移动方向（角度），指示距离北方的角度。0度表示指向正北方，方向以顺时针旋转（这表示东方是90度，西方是270度）。如果speed是0，heading会是NaN。如果设备无法提供heading信息，值为null。  
> speed —— 返回设备每秒的移动速度（米）。speed可能为null。  
> timestamp —— 获取信息的时间戳。

<table> 
 <tbody> 
  <tr> 
   <td style="width:134px;"><strong>Package</strong></td> 
   <td>laya.device.geolocation</td> 
  </tr> 
  <tr> 
   <td style="width:134px;"><strong>类</strong></td> 
   <td>public class Geolocation</td> 
  </tr> 
  <tr> 
   <td style="width:134px;"><strong>Inheritance</strong></td> 
   <td>Geolocation <img alt="Inheritance" src="https://img-blog.csdnimg.cn/20181224101952450"> Object</td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <th colspan="1">Property（属性）</th> 
  </tr> 
  <tr> 
   <td><a href="https://layaair.ldc.layabox.com/api/?category=%E8%BE%93%E5%85%A5%E8%AE%BE%E5%A4%87&amp;class=laya.device.geolocation.Geolocation#enableHighAccuracy" rel="nofollow">enableHighAccuracy</a> : Boolean = false <p>[static] 如果enableHighAccuracy为true，并且设备能够提供一个更精确的位置，则会获取最佳可能的结果。 请注意,这可能会导致较慢的响应时间或增加电量消耗（如使用GPS）。 另一方面，如果设置为false，将会得到更快速的响应和更少的电量消耗。 默认值为false。</p> </td> 
  </tr> 
  <tr> 
   <td><a href="https://layaair.ldc.layabox.com/api/?category=%E8%BE%93%E5%85%A5%E8%AE%BE%E5%A4%87&amp;class=laya.device.geolocation.Geolocation#maximumAge" rel="nofollow">maximumAge</a> : Number = 0 <p>[static] 表示可被返回的缓存位置信息的最大时限。 如果设置为0，意味着设备不使用缓存位置，并且尝试获取实时位置。 如果设置为Infinity，设备必须返回缓存位置而无论其时限。</p> </td> 
  </tr> 
  <tr> 
   <td><a href="https://layaair.ldc.layabox.com/api/?category=%E8%BE%93%E5%85%A5%E8%AE%BE%E5%A4%87&amp;class=laya.device.geolocation.Geolocation#supported" rel="nofollow">supported</a> : Boolean <p>[static] 是否支持。</p> </td> 
  </tr> 
  <tr> 
   <td><a href="https://layaair.ldc.layabox.com/api/?category=%E8%BE%93%E5%85%A5%E8%AE%BE%E5%A4%87&amp;class=laya.device.geolocation.Geolocation#timeout" rel="nofollow">timeout</a> : Number = 1E10 <p>[static] 表示允许设备获取位置的最长时间。默认为Infinity，意味着getCurentPosition()直到位置可用时才会返回信息。</p> </td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <th colspan="1">Method（方法）</th> 
  </tr> 
  <tr> 
   <td> <p><a href="https://layaair.ldc.layabox.com/api/?category=%E8%BE%93%E5%85%A5%E8%AE%BE%E5%A4%87&amp;class=laya.device.geolocation.Geolocation#Geolocation%28%29" rel="nofollow">Geolocation</a>()</p> </td> 
  </tr> 
  <tr> 
   <td> <p><a href="https://layaair.ldc.layabox.com/api/?category=%E8%BE%93%E5%85%A5%E8%AE%BE%E5%A4%87&amp;class=laya.device.geolocation.Geolocation#clearWatch%28%29" rel="nofollow">clearWatch</a>(id:int):void&nbsp; &nbsp;[static] 移除watchPosition安装的指定处理器。</p> </td> 
  </tr> 
  <tr> 
   <td> <p><a href="https://layaair.ldc.layabox.com/api/?category=%E8%BE%93%E5%85%A5%E8%AE%BE%E5%A4%87&amp;class=laya.device.geolocation.Geolocation#getCurrentPosition%28%29" rel="nofollow">getCurrentPosition</a>(onSuccess:Handler, onError:Handler = null):void&nbsp; &nbsp;[static] 获取设备当前位置。</p> </td> 
  </tr> 
  <tr> 
   <td> <p><a href="https://layaair.ldc.layabox.com/api/?category=%E8%BE%93%E5%85%A5%E8%AE%BE%E5%A4%87&amp;class=laya.device.geolocation.Geolocation#watchPosition%28%29" rel="nofollow">watchPosition</a>(onSuccess:Handler, onError:Handler):int&nbsp; &nbsp;[static] 监视设备当前位置。回调处理器在设备位置改变时被执行。</p> </td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <th colspan="1">Constant（常量）</th> 
  </tr> 
  <tr> 
   <td><a href="https://layaair.ldc.layabox.com/api/?category=%E8%BE%93%E5%85%A5%E8%AE%BE%E5%A4%87&amp;class=laya.device.geolocation.Geolocation#PERMISSION_DENIED" rel="nofollow">PERMISSION_DENIED</a> : int = 1&nbsp; &nbsp;[static] 由于权限被拒绝造成的地理信息获取失败。</td> 
  </tr> 
  <tr> 
   <td><a href="https://layaair.ldc.layabox.com/api/?category=%E8%BE%93%E5%85%A5%E8%AE%BE%E5%A4%87&amp;class=laya.device.geolocation.Geolocation#POSITION_UNAVAILABLE" rel="nofollow">POSITION_UNAVAILABLE</a> : int = 2&nbsp; &nbsp;[static] 由于内部位置源返回了内部错误导致地理信息获取失败。</td> 
  </tr> 
  <tr> 
   <td><a href="https://layaair.ldc.layabox.com/api/?category=%E8%BE%93%E5%85%A5%E8%AE%BE%E5%A4%87&amp;class=laya.device.geolocation.Geolocation#TIMEOUT" rel="nofollow">TIMEOUT</a> : int = 3&nbsp; &nbsp;[static] 信息获取所用时长超出timeout所设置时长。</td> 
  </tr> 
 </tbody> 
</table>

# 应用示例 #

特别提醒：使用 Geolocation 地理定位时，必须导入 core | webgl | device | BaiduMap/bdmini  等 js 库。

## 获取当前定位 ##

//使用Geolocation地理定位时，必须导入 loadLib("libs/laya.bdmini.js"); 地图库
    
    //初始化引擎
    Laya.init(1280, 1200,Laya.WebGL);
    //创建一个文本对象，用于显示手机旋转时的陀螺仪数据
    let infoText = new Laya.Text();
    infoText.fontSize = 70;//字体大小70px
    infoText.color = "#FFFFFF";//字体颜色白色
    infoText.borderColor = "#f00";//文本组件边框颜色为红色
    infoText.wordWrap = true;
    
    //设置文本组件的大小等于整个舞台大小
    infoText.size(Laya.stage.width, Laya.stage.height);
    Laya.stage.addChild(infoText);//将文本添加到舞台
    
    // 尝试获取当前位置
    Laya.Geolocation.getCurrentPosition(Laya.Handler.create(this, onSuccess), Laya.Handler.create(this, onError));
    
    // 成功获取位置后触发
    function onSuccess(position){
        var text = '经纬度:(' + position.longitude + '°,' + position.latitude + '°),\r\n精度:'+position.accuracy + 'm';
        
        if(position.altitude != null){
            text += "\r\n海拔:"+ position.altitude + 'm' + (position.altitudeAccuracy != null ? (',精度:' + position.altitudeAccuracy + 'm') : '');
        }
        if(position.heading != null && !isNaN(position.heading)){
            text += '\r\n方向:' + position.heading + "°";    
        }
        if(position.speed != null && !isNaN(position.speed)){
            text += '速度:' + position.speed + "m/s";
        }
        infoText.text = text;
    }
    
    // 获取位置失败后触发
    function onError(err){
        var errType;
        if (err.code = Geolocation.PERMISSION_DENIED){
            errType = "Permission Denied";
        } else if (err.code == Geolocation.POSITION_UNAVAILABLE){
            errType = "Position Unavailable";
        } else if (err.code == Geolocation.TIMEOUT){
            errType = "Time Out";
        }
        infoText.text = 'ERROR(' + errType + '): ' + err.message;
    }

![20181224101940125.gif][]

## 监视位置改变 ##

请参考 LayaAir 官网：[https://ldc.layabox.com/doc/?nav=zh-js-1-7-2][https_ldc.layabox.com_doc_nav_zh-js-1-7-2]

或者菜鸟教程：[http://www.runoob.com/html/html5-geolocation.html][http_www.runoob.com_html_html5-geolocation.html]

[http_caniuse.com_search_geolocation]: http://caniuse.com/#search=geolocation
[Geolocation]: https://layaair.ldc.layabox.com/api/?category=%E8%BE%93%E5%85%A5%E8%AE%BE%E5%A4%87&class=laya.device.geolocation.Geolocation
[HTML5 Geolocation]: https://blog.csdn.net/wangmx1993328/article/details/85223212
[GeolocationInfo]: https://layaair.ldc.layabox.com/api/?category=%E8%BE%93%E5%85%A5%E8%AE%BE%E5%A4%87&class=laya.device.geolocation.GeolocationInfo
[20181224101940125.gif]: /images/20220403/b17aa259c1d94ac7bd86bc28daa4421a.png
[https_ldc.layabox.com_doc_nav_zh-js-1-7-2]: https://ldc.layabox.com/doc/?nav=zh-js-1-7-2
[http_www.runoob.com_html_html5-geolocation.html]: http://www.runoob.com/html/html5-geolocation.html