geolocation

window.navigator.geolocation

1、getCurrentPosition() // 获取当前的位置信息

2、watchPosition() // 监视位置变化，和1参数一样

3、clearWatch() // 清除位置监视

 

1、getCurrentPosition(s, e, p)

success回调 (必须)

error回调

options参数

需要FQ

// 特别注意，chrome需要在连上vpn的时候才能获取到

var success = function (pos)

    {

        console.log(pos);

    };

// 只传一个参数

window.navigator.geolocation.getCurrentPosition(success);

Geoposition对象

Geoposition对象属性

latitude 纬度

longitude 经度

altitude 海拔

accuracy 定位精准度，单位m

altitudeAccuracy 海拔精准度，单位m

heading 方向

speed 速度

https://dev.w3.org/geo/api/spec-source.html#coordinates_interface

PositionError对象

用户拒绝 code = 1

获取不到 code = 2

连接超时 code = 3

https://dev.w3.org/geo/api/spec-source.html#position_error_interface

配置参数

enableHighAccuracy 是否需要高精度位置默认false

timeout 单位ms 请求超时时间 默认infinity

maximumAge 单位ms，watchPosition方法则不停地取用户的地理位置信息，不停地更新用户的位置信息。位置信息过期时间 设置为0就无条件获取新的地理位置信息 默认0

https://dev.w3.org/geo/api/spec-source.html#position_options_interface

watchPosition

var id = geolocation.watchPosition(fu) 用于注册监听器，在设备的地理位置发生改变的时候自动被调用。

参数与 getCurrentPosition 相同

clearWatch(id) 使用 clearWatch 清除监听

devicemotion监听加速度变化

window.addEventListener('devicemotion', function(event)

      { console.log(event); }

            );

devicemotion事件所包含的属性

1.accelerationIncludingGravity （包括重心引力,z轴方向加了9.8,在x,y方向上的值两者相同）重力加速度

2.acceleration 重力加速度 （需要陀螺仪支持）

3.rotationRate(alpha, beta, gamma)旋转速率

4.interval // 获取的时间间隔     均为只读属性

微信摇一摇

微信摇一摇，通过服务器（wampmanager）打开网页，window+r（快捷方式）打开cmd，输入ipconfig，找到 Ipv4 的地址，如下：

将localhost改成 Ipv4 的值，将改后的网址用草料二维码生成器扫码到手机上显示  （手机和电脑应在同一局域网下）

</head>
    <div id = "demo"></div>
<body>
    <script>
       var speed = 25;
       var lastTime = 0;
       var lastX = 0; lastY = 0; lastZ = 0;
       window.addEventListener('devicemotion',function(event){
          console.log(event);
          demo.innerHTML = 'acceleration-x' + event.acceleration.x + '<br/>y:' + event.acceleration.y + '<br/>z:' + event.acceleration.z + '<br/>'
                           + 'accelerationIncludingGravity-x' + event.accelerationIncludingGravity.x + '<br/>y:' + event.accelerationIncludingGravity.y + '<br/>z:' + event.accelerationIncludingGravity.z
          var x = event.acceleration.x;
          var y = event.acceleration.y;
          var z = event.acceleration.z;
          var nowTime = (new Date()).getTime();
          if(nowTime - lastTime > 500){
             lastTime = nowTime;
              if(Math.abs(x - lastX) > speed || Math.abs(y-lastY) > speed || Math.abs(z-lastZ) > speed){
                 alert('摇一摇');
                 lastX = x;
                 lastY = y;
                 lastZ = z;
              }
          }                  
       });
  </script>
</body>

 

deviceorientation监听设备在方向上的变化

window.addEventListener(‘deviceorientation’, function(event){
console.log(event);
});
deviceorientation事件所包含的属性

1.alpha 表示设备沿z轴上的旋转角度，范围为0~360。

2.beta 表示设备在x轴上的旋转角度，范围为-180~180。它描述的是设备由前向后旋转的情况。

3.gamma 表示设备在y轴上的旋转角度，范围为-90~90。它描述的是设备由左向右旋转的情况。

      window.addEventListener('deviceorientation', function(e){
       demo.innerHTML = 'alpha :' + e.alpha + '<br/>'
                       + 'beta :' + e.beta + '<br/>'
                       + 'gamma :' + e.gamma + '<br/>'
      },false);

4、webkitCompassHeading：与正北方向的角度差值。正北为0度，正东为90度，正南为180度，正西为270度。因为0度是正北，所以叫指北针。

5、webkitCompassAccuracy：指北针的精确度，表示偏差为正负多少度。一般是10。