地理位置情報 API

Geolocation API は、ユーザーの地理的位置を取得するために使用されます。

この機能はユーザーのプライバシーに関わるため、ブラウザーはユーザーに地理的位置の提供に同意するよう求めますが、ユーザーは拒否することもできます。また、本APIはHTTPS環境でのみ利用可能です。

ブラウザは、「navigator.geolocation」プロパティを通じてこの API を提供します。

地理位置情報オブジェクト

navigator.geolocation プロパティは Geolocation オブジェクトを返します。このオブジェクトには以下の 3 つのメソッドがあります。

  • Geolocation.getCurrentPosition(): ユーザーの現在位置を表す Position オブジェクトを返します。
  • Geolocation.watchPosition(): ユーザーの位置が変わるたびに実行されるリスニング関数を指定します。
  • Geolocation.clearWatch(): watchPosition()メソッドで指定されたリスニング機能をキャンセルします。

Geolocation.getCurrentPosition()

Geolocation.getCurrentPosition() メソッドは、ユーザーの位置を取得するために使用されます。

navigator.geolocation.getCurrentPosition(成功、エラー、オプション)

このメソッドは 3 つのパラメータを受け入れます。

  • success: ユーザーが位置の指定に同意したときのコールバック関数。そのパラメータは Position オブジェクトです。
  • error: ユーザーが位置の提供を拒否した場合のコールバック関数。そのパラメータは PositionError オブジェクトです。このパラメータはオプションです。
  • options: パラメータ オブジェクト。このパラメータはオプションです。

Position オブジェクトには 2 つのプロパティがあります。

  • Position.coords: 現在の位置の座標を表す Cooperatives オブジェクトを返します。
  • Position.timestamp: 現在のタイムスタンプを表すオブジェクトを返します。

PositionError オブジェクトには 2 つの主要なプロパティがあります。

  • PositionError.code: エラーの理由を示す整数。 「1」は許可がないことを意味します。ユーザーが許可を拒否した可能性があります。「2」は位置情報を取得できないことを意味します。「3」はタイムアウトを意味します。
  • PositionError.message: エラーの説明を表す文字列。

パラメータ オブジェクト option では 3 つの属性を指定できます。

  • enableHighAccuracy: ブール値、高精度の結果を返すかどうか。 「true」に設定すると、応答時間が遅くなったり、(モバイル デバイスの) 消費電力が増加したりする可能性があります。逆に、「false」に設定すると、デバイスはより速く応答できます。デフォルト値は「false」です。
  • timeout: クエリを待機する最大時間をミリ秒単位で示す正の整数。デフォルト値は「無限」です。
  • maximumAge: 許容可能な最大キャッシュ時間をミリ秒単位で示す正の整数。 「0」に設定すると、キャッシュされた値は返されず、現在の実際の位置を照会する必要があることを意味します。「Infinity」に設定した場合は、キャッシュされた期間に関係なく、キャッシュされた値を返す必要があります。デフォルト値は「0」です。

以下に例を示します。

var オプション = {
  EnableHighAccuracy: true、
  タイムアウト: 5000、
  最大年齢: 0
};

関数成功(pos) {
  var crd = pos.coords;

  console.log(`経度: ${crd.latitude}`);
  console.log(`緯度: ${crd.longitude}`);
  console.log(`エラー: ${crd.accuracy} メートル`);
}

関数エラー(err) {
  console.warn(`ERROR(${err.code}): ${err.message}`);
}

navigator.geolocation.getCurrentPosition(成功、エラー、オプション);

Geolocation.watchPosition()

Geolocation.watchPosition() オブジェクトは、ユーザーの位置が変わるたびに、この関数が自動的に実行されるリスニング関数を指定します。

navigator.geolocation.watchPosition(成功[, エラー[, オプション]])

このメソッドは 3 つのパラメータを受け入れます。

  • success: 成功をリッスンするコールバック関数。この関数のパラメータは Position オブジェクトです。
  • error: このパラメータはオプションであり、失敗した監視のコールバック関数を表します。この関数のパラメータは PositionError オブジェクトです。
  • options: このパラメータはオプションであり、監視パラメータ設定オブジェクトを表します。

このメソッドは、リスニング関数の番号を表す整数値を返します。この整数は、監視をキャンセルするために Geolocation.clearWatch() メソッドによって使用されます。

以下に例を示します。

変数ID;

変数ターゲット = {
  緯度:0、
  経度: 0
};

var オプション = {
  イネーブル高精度: false、
  タイムアウト: 5000、
  最大年齢: 0
};

関数成功(pos) {
  var crd = pos.coords;

  if (target.latitude === crd.latitude && target.longitude === crd.longitude) {
    console.log('おめでとうございます。指定された場所に到着しました。');
    navigator.geolocation.clearWatch(id);
  }
}

関数エラー(err) {
  console.warn('ERROR(' + err.code + '): ' + err.message);
}

id = navigator.geolocation.watchPosition(成功、エラー、オプション);

Geolocation.clearWatch()

Geolocation.clearWatch() メソッドは、watchPosition() メソッドで指定されたリスニング機能をキャンセルするために使用されます。そのパラメータは、watchPosition() によって返されるリスニング関数の番号です。

navigator.geolocation.clearWatch(id);

使用方法の例については、前のセクションを参照してください。

座標オブジェクト

Coowned オブジェクトは地理的位置の座標インターフェイスであり、Position.coords プロパティはこのオブジェクトを返します。

これには次のプロパティがあり、すべて読み取り専用です。

  • Coowned.latitude: 緯度を表す浮動小数点数。
  • Coowned.longitude: 経度を表す浮動小数点数。
  • Coowned.altitude: 高度を表す浮動小数点数 (単位: メートル)。利用できない場合は「null」を返します。
  • 座標.精度: 経度と緯度の精度を示す浮動小数点数(単位: メートル)。
  • Coowned.altitudeAccuracy: 高度の精度を示す浮動小数点数 (単位: メートル)。 「null」を返します。
  • Coowned.speed: デバイスの速度を表す浮動小数点数 (単位: メートル/秒)。利用できない場合は「null」を返します。
  • Coowned.Heading: デバイスの方向を示す浮動小数点数 (単位: 度)。方向は時計回りで、北が 0 度、東が 90 度、西が 270 度です。 Coowned.speed が 0 の場合、Heading プロパティは NaN を返します。デバイスが方向情報を提供できない場合、このプロパティは「null」を返します。

以下に例を示します。

navigator.geolocation.getCurrentPosition( 関数 (位置) {
  緯度 = 位置.座標.緯度; とします。
  let long = 位置.座標.経度;
  console.log(`Latitude: ${lat.toFixed(2)}`);
  console.log(`経度: ${long.toFixed(2)}`);
});

参考リンク


作者: wangdoc

アドレス: https://wangdoc.com/

ライセンス: クリエイティブ・コモンズ 3.0