Geolocation地理的位置付け

6210 ワード
location
厳密には、Geolocation APIはHTML 5の標準仕様ではありませんが、そのAPIインタフェースは、ブラウザまたはモバイルデバイスのブラウザにユーザーの現在の位置情報を取得させることができます.
 
Geolocation APIはwindowを介しています.navigator.geolocationは地理的位置へのアクセスを取得します.このオブジェクトには、次の3つの方法があります.
  • getCurrentPosition()
  • watchPosition()
  • clearWatch()

    • 1現在位置を初めて取得
    getCurrentPositionメソッドでは、次のように3つのパラメータを渡すことができます.
    　　　　　 
    1 void getCurrentPostion(in PositionCallback successCallback,in optional PositionErrorCallback error Callback,in optional PositionOptions options);

    第1のパラメータは必須パラメータであり、地理的位置情報の取得に成功した後に実行されるコールバック関数を返す役割を果たす.
    2番目のパラメータは、地理的位置情報の異常または失敗を取得したときに実行されるコールバック関数で、オプションのパラメータです.
    3番目のパラメータはオプションパラメータで、主にいくつかのオプション属性パラメータ設定です.
     1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta charset='utf-8'>
 5 <title>Geolocation API     </title>
 6 <script type-"text/javascript">
 7   navigator.geolocation.getCurrentPosition(function(pos){
 8      console.log("         ："+pos.coords.latitude);
 9      console.log("         ："+pos.coords.longitude);
10      console.log("        ："+pos.coords.accuracy);
11 });
12 
13 </script>
14 </head>
15 <body>
16 </body>
17 </html>

    posオブジェクトには、一連の地理的座標情報を表すcoords属性が含まれます.
  • latitude:10進数で示す緯度
  • longitude:10進数で表される経度
  • altitude:楕円球面に対する位置の高さ
  • accuracy:メートル単位の経度と緯度座標の精度レベル
  • altitudeAccuracy:メートル単位の高さ座標精度レベル
  • heading:運動の方向は、真北に対して時計回りに回転する角度で指定します.
  • speed:メートル/秒単位のデバイスの現在の地上速度.

    •  
    posオブジェクトには、coordsオブジェクトを返すときにミリ秒単位でタイムスタンプを作成するためのtimestampプロパティも含まれます.
    　　
    getCurrentPositionメソッドの3番目のパラメータのプロパティは、次のとおりです.
    enableHighAccuracy:ブラウザまたはモバイルデバイスが経度と緯度をより正確に読み取りようとすることを指定します.デフォルトはfalseです.
    timeout:geolocationにミリ秒単位の最大時間間隔を許可するように伝えます.
    maximunAge:キャッシュの位置情報の時間がこのパラメータ設定値より大きくない場合、アプリケーションはキャッシュの位置情報を受け入れます.単位はミリ秒です.
    2移動機器の位置変化監視
    watchPositionとclearWatchは一対の方法であり,その原理はsetInterval,setTimeout法と同じである.watchPositionメソッドは一意の識別子を返し、clearWatchはこの一意の識別子によってwatchPositionメソッドのリスニングをクリアすることができる.
    watchPositionの構文はgetCurrentPositionと同じで、3つのパラメータを入力できます.
  • の最初のパラメータは、リスニングに成功した後に返される関数である.
  • の2番目のパラメータは、リスニングに失敗した後に返される関数である.
  • の3番目のパラメータはオプションのパラメータです.
    •  1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta charser="utf-8">
 5 <title>Geolocation API     </title>
 6 
 7 <script type="text/javascript">
 8     navigator.geolocation.getCurrentPosition(function(pos){
 9                 console.log("         ："+pos.coords.latitude);
10                 console.log("         ："+pos.coords.longitude);
11                 console.log("        ："+pos.coords.accuracy);
12 
13 });        
14 var watchID = navigator.geolocation.watchPosition(function(pos){
15               console.log("         ："+pos.coords.latitude);
16              console.log("         ："+pos.coords.longtitude);
17             console.log("            ："+pos.coords.accuracy);
18 navigator.geolocation.clearWatch(watchID);
19 },function(){
20 
21 });
22 
23     </script>
24 
25 </head>
26 <body>
27 </body>
28 </html>

    express+reactソリューション(一)
    入力ボックスplaceholderテキストのデフォルト色の変更-webkit-input-placeholder