緯度と経度の取得方法

広告

JavaScriptマップAPIを使用する時、任意の地点の緯度と経度の取得したい場合があります。ここではYahoo!地図を使って調べる方法を確認します。

ブラウザで次のURLへアクセスして下さい。

http://map.yahoo.co.jp/

p4-1

緯度と経度を調べたい地点を地図の中央に表示します。

p4-2

画面右上にある「この地図のURL」と書かれたリンクをクリックして下さい。

p4-3

「この地図のURL」と書かれた下に表示されたURLをコピーして下さい。今回の場合であれば次のようなURLとなります。 

http://map.yahoo.co.jp/pl?type=scroll
&lat=35.18556725298448
&lon=136.89904988816627
&z=17
&mode=map
&pointer=on
&datum=wgs
&fa=ks
&home=on
&hlat=35.168729853506
&hlon=136.87295735887
&layout=
&ei=utf-8
&p=

※非常に長いので、パラメータ毎に改行しています。

地図の表示方法などによってURLに含まれる項目に違いはありますが、この中で緯度と軽度は「lat=緯度」「lon=経度」の部分となります。(世界測地系での座標となります)。 

緯度=35.18556725298448
経度=136.89904988816627

なお、実際に使用する場合はここまで細かく指定する必要はなく少数点以下は6桁程度でいいかと思います。

サンプルプログラム

では実際に試してみます。先ほど取得した緯度と経度を指定しています。

code4_1.js 

window.onload = function() {
  var ymap = new Y.Map("map");
  ymap.drawMap(new Y.LatLng(35.185567, 136.899049), 17);
}

sample4_1.html 

<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>

    <title>Yahoo! JavaScriptマップAPI</title>

    <script type="text/javascript" charset="utf-8"
    src="http://js.api.olp.yahooapis.jp/OpenLocalPlatform/V1/jsapi?appid=(id)">
    </script>

    <script src="./js/code4_1.js" type="text/javascript"></script>

  </head>
  <body>
    <p>
    JavaScriptマップAPIを使ったサンプルです。
    </p>

    <div id="map" style="width:400px; height:300px"></div>

    <!-- Begin Yahoo! JAPAN Web Services Attribution Snippet -->
    <a href="http://developer.yahoo.co.jp/about">
    <img src="http://i.yimg.jp/images/yjdn/yjdn_attbtn1_125_17.gif" title="Webサービス by Yahoo! JAPAN" alt="Web Services by Yahoo! JAPAN" width="125" height="17" border="0" style="margin:10px 15px 15px 15px"></a>
    <!-- End Yahoo! JAPAN Web Services Attribution Snippet -->

  </body>
</html>

ブラウザでアクセスすると次のように表示されます。

p4-4

このようにAPIで使用する座標を調べることができます。

( Written by Tatsuo Ikura+ )

Facebook Page