ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript で現在地を検索する

JavaScript で現在地を検索する

Patricia Arquette
Patricia Arquetteオリジナル
2024-11-10 07:55:02855ブラウズ

Find your Location With Javascript

このブログ投稿では、ブラウザーから現在の位置を取得し、経度と緯度の座標を使用して正確な位置を特定する方法を示します。 Maps.co の無料 API を使用して、座標を人間が判読できる形式に変換するリバース ジオコーディングを実行します

実装手順:

  • 現在の位置の取得: ブラウザーが提供するユーザーの現在の位置にアクセスします (ユーザーの許可を得て)。これにより、緯度と経度の値が得られます。

  • リバース ジオコーディング API: これらの座標を使用して、Maps.co のリバース ジオコーディング API への API 呼び出しを実行して、完全な住所を取得します。プラットフォームにサインアップすると、API キーを無料で取得できます。

  • API エンドポイント: リバース ジオコーディングのエンドポイントは次のとおりです:

https://geocode.maps.co/reverse?lat=latitude&lon=longitude&api_key=YOUR_API_KEY

緯度と経度を実際の値に置き換え、YOUR_API_KEY を個人の API キーに置き換えます。

`const api_key = "you key";

const currentLocation = () => {
    navigator.geolocation.getCurrentPosition((position) => {
        fetchLocation(position.coords.longitude, position.coords.latitude)
    }, (error) => {
         console.error("Current Location", error);
    })

}
const fetchLocation = async (lon, lat) => {
    try {
           const location = await fetch(`https://geocode.maps.co/reverse?lat=${lat}&lon=${lon}&api_key=${api_key}`)
     const response = await location.json();
     console.log(response?.display_name);
    }
    catch (error) {
         console.error("Error fetching location:", error);
    }

}

currentLocation();`

以上がJavaScript で現在地を検索するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。