HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

GoogleマップでHTML5GeoLocationAPIを使用するにはどうすればよいですか？

HTML5 Geolocation APIを使用すると、現在地をお気に入りのWebサイトと共有できます。 Javascriptは緯度と経度をキャプチャし、バックエンドWebサーバーに送信して、地元のお店を見つけたり、地図上に現在地を表示したりするなど、場所を意識した凝ったことを行うことができます。地理位置座標は、デバイスの地理的位置を指定します。

getCurrentPostion（）メソッドを使用して現在の場所を取得します。 GoogleマップでHTML5ジオロケーションを使用して現在地を取得するには、Google StaticMapsAPIのAPIキーを設定する必要があります。

https://console.developers.google.comにアクセスして、Googleマップの無料のAPIキーを取得します。このキーをコードに追加して、Geolocationを操作します。

GoogleマップでHTML5GeoLocationAPIを使用するにはどうすればよいですか？

次のコードを実行して、GoogleマップでHTML5ジオロケーションを使用して現在地を表示することができます-

例 
<!DOCTYPE HTML>
<html>
   <head>
      <script type = "text/javascript">
         function showLocation(position) {
            var latitude = position.coords.latitude;
            var longitude = position.coords.longitude;
            var latlongvalue = position.coords.latitude + ","
                              + position.coords.longitude;
            var img_url = "https://maps.googleapis.com/maps/api/staticmap?center="
                          +latlongvalue+"&zoom=14&size = 400x300&key =
                          AIzaSyAa8HeLH2lQMbPeOiMlM9D1VxZ7pbGQq8o";
            document.getElementById("mapholder").innerHTML =
            "<img src ='"+img_url+"'>";
         }
         function errorHandler(err) {
            if(err.code == 1) {
               alert("Error: Access is denied!");
            }else if( err.code == 2) {
               alert("Error: Position is unavailable!");
            }
         }
         function getLocation(){
            if(navigator.geolocation){
               // timeout at 60000 milliseconds (60 seconds)
               var options = {timeout:60000};
               navigator.geolocation.getCurrentPosition
               (showLocation, errorHandler, options);
            }else{
               alert("Sorry, browser does not support geolocation!");
            }
         }
      </script>
   </head>
   <body>
      <div id="mapholder"></div>
      <form>
         <input type="button" onclick="getLocation();" value="Your Location"/>
      </form>
   </body>
</html>

  1. Google Maps Wildfire 追跡の使用方法

    山火事が発生しやすい地域に住んでいる場合や愛する人がいる場合は、Google マップの山火事の追跡が必須です。火災が発生した場所、火災の広がり、封じ込めの程度を確認できます。 この Google マップ機能の優れている点は、ウェブと Google マップ モバイル アプリで利用できることです。これにより、どこにいても山火事についていくことができます。 ウェブでの Google マップ 山火事追跡 Google マップの Web サイトにアクセスして、わずか数ステップで山火事の追跡を表示します。必要に応じて Google アカウントにログインできますが、必須ではありません。 場所を検索す

  2. Google マップを使用して Excel で距離を計算する方法

    Excel にはさまざまなアプリケーションがあります。 VBA の使用中 そうすれば、Excel でやりたいことが何でもできるようです。もちろん、場所間の距離を見つけることもできます エクセルの地図を使っています。この記事では、Google マップを使用して Excel で距離を計算するためのクイック ガイドを、シャープなステップと明確なイラストで示します。 ここから無料の Excel ワークブックをダウンロードして、自分で練習できます。 ユーザー定義関数を使用して Excel で Google マップとの距離を計算する ここで、距離を見つけます Google マップを使用して、マッカ