コメント：このサイドディッシュはHTML5の学習を開始したばかりで、今では地理的に非常に興味を持っています。基本的なマップポジショニング機能は、Google Map APIと組み合わせて実装されています。次の手順が主に使用されています。現在の地理的位置を取得し、Google Map APIを呼び出して現在の位置情報を取得します。
このサイドディッシュは、HTML5の学習を開始したばかりで、ジオロケーションに非常に興味があり、Google MapのAPIを組み合わせて基本的なマップポジショニング機能を実装しています。1.現在の地理的位置を取得します
メソッドvoid getCurrentPosition（onsuccess、onerror、options）を呼び出します。
OnSuccessが現在の位置情報が成功したときに実行されるコールバック関数である場合、Onerrorは現在の位置情報が失敗したときに実行されるコールバック関数です。オプションはオプションの馴染みのあるリストです。 2番目と3番目のパラメーターは、オプションの属性です。
OnSuccessコールバック関数では、パラメーター位置を使用して特定の位置オブジェクトを表し、現在の位置を表します。次のプロパティがあります。
•緯度：現在の地理的位置の緯度。
•経度：現在の地理的位置の経度。
•高度：現在の場所の高度（取得できない場合はnull）。
•精度：得られた緯度と経度の精度（メートル単位）。
•高度の高度の経度（メートル）。
•見出し：デバイスの方向。前方方向に面する時計回りの回転角（取得できない場合はnull）で表されます。
•速度：デバイスの前方速度（メートル/秒単位、取得できない場合はヌル）。
•タイムスタンプ：ジオロケーション情報を取得する時間。
Onerrorコールバック関数では、エラーパラメーターが使用されます。次のプロパティがあります。
•コード：エラーコード、次の値。
1.ユーザーはロケーションサービスを拒否しました（属性値は1）。
2。位置情報を取得できません（属性値は2）。
3.情報タイムアウトエラーを取得します（プロパティ値は3）。
•メッセージ：文字列、特定のエラー情報を含む。
オプションパラメーターでは、オプションのプロパティは次のとおりです。
•HighAccuracyを有効にする：高精度の地理的情報が必要かどうか。
•タイムアウト：タイムアウト時間（ミリ秒単位）を設定します。
•最大値：キャッシュジオロケーション情報の有効な時間（ミリ秒単位）。
以前にサポートされていなかったブラウザと互換性があるように、ブラウザがHTML5をサポートして地理的位置情報を取得するかどうかを判断するために、次のコードを記述する必要があることに注意してください。
if（navigator.geolocation）{
//現在の地理的位置情報を取得します
navigator.geolocation.getCurrentPosition（onsuccess、onerror、options）;
} それ以外 {
alert（ "ブラウザは、地理的情報を取得するためにHTML5をサポートしていません。"）;
}
2.現在の位置情報を取得するには、GoogleマップAPIに電話してください
まず、ページのGoogleマップAPIのスクリプトファイルを参照する必要があります。インポート方法は次のとおりです。
<script type = "text/javascript" src = "http://maps.google.com/maps/api/js?sensor=false"> </script>
第二に、マップパラメーターを設定すると、設定方法は次のとおりです。
// Googleマップで座標ポイントを指定し、座標ポイントの水平座標と垂直座標も指定します。
var latlng = new google.maps.latlng（coords.latitude、coords.longitude）;
var myoptions = {
ズーム：14、//倍率を設定します
中央：ラトルン、//マップの中心点を指定された座標ポイントに設定します
maptypeid：google.maps.maptypeid.roadmap //マップタイプを指定します
};
最後に、マップを作成してページに表示すると、作成方法は次のとおりです。
//マップを作成し、ページマップに表示します
var map = new Google.maps.map（document.getElementById（ "Map"）、myoptions）;
最後に、この例のすべてのコードが表示されます。コードを以下に示します。
<！doctype html>
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<Meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<Title>現在の場所を取得し、Googleマップに表示</title>
<script type = "text/javascript" src = "http://maps.google.com/maps/api/js?sensor=false"> </script>
<script type = "text/javascript">
function init（）{
if（navigator.geolocation）{
//現在の地理的位置を取得します
navigator.geolocation.getCurrentPosition（function（position）{
var coords = position.coords;
//CONSOLE.LOG(Position）;
// Googleマップで座標ポイントを指定し、座標ポイントの水平座標と垂直座標も指定します。
var latlng = new google.maps.latlng（coords.latitude、coords.longitude）;
var myoptions = {
ズーム：14、//倍率を設定します
中央：ラトルン、//マップの中心点を指定された座標ポイントに設定します
maptypeid：google.maps.maptypeid.roadmap //マップタイプを指定します
};
//マップを作成し、ページマップに表示します
var map = new Google.maps.map（document.getElementById（ "Map"）、myoptions）;
//マップ上にマークを作成します
var marker = new google.maps.marker（{
位置：latlng、//上記の座標をクリックします
マップ：マップ//作成したばかりのマップでこの注釈を設定します
}）;
// [プロンプト]ウィンドウをタグ付けします
var infowindow = new google.maps.infowindow（{
コンテンツ： "現在の場所：<br/> long：" + latlng.lat（） + "<br/> dimension：" + latlng.lng（）//プロンプトメッセージ
}）;
//プロンプトウィンドウを開きます
infowindow.open（Map、Marker）;
}、
関数（エラー）{
//エラーの処理
switch（error.code）{
ケース1：
alert（ "ロケーションサービスが拒否されました。"）;
壊す;
ケース2：
alert（ "当面は位置情報を取得できません。"）;
壊す;
ケース3：
alert（ "情報タイムアウトを取得します。"）;
壊す;
デフォルト：
アラート（ "不明エラー。"）;
壊す;
}
}）;
} それ以外 {
alert（ "ブラウザは、地理的情報を取得するためにHTML5をサポートしていません。"）;
}
}
</script>
</head>
<body>
<div> </div>
</body>
</html>