Yahoo地図を使ってみる

Yahoo地図にアクセスするにはどうするのがいいかをまずチェック。

まずはここでアプリケーションIDを取得することが必要みたい。このアプリケーションIDはYahooのアカウント1個にたいして10個まで作れるので、まあ十分な数と想う。

つぎに、地図を表示するのに日本語の住所から変換するのは無いかチェック。

うーん、AtlasLabみたいに直接的なのはないけど、「住所から緯度経度を取得」->「画面表示」の流れで別々に作ればいけるっぽいので、サンプル

まず、住所から緯度経度の取得は、ローカルサーチAPIが用意されているので、これをチェック。RESTで作られているので単にGETで問い合わせれば帰ってくるみたい。XMLで帰ってくるよりJSONの方が実際は便利そうだから、オプションも設定してみる。

require "rubygems"
require "json"
require "cgi"
require "net/http"

@app_id = "アプリケーションid"
@host = "api.map.yahoo.co.jp"
@path = "/LocalSearchService/V1/LocalSearch?appid=#{@app_id}&o=json"

address = "適当な住所"

Net::HTTP.version_1_2
Net::HTTP.start(@host,80) {|http|
   @json_src = http.get("#{@path}&p=#{CGI::escape(address)}").body
}

data =  JSON.parse(@json_src)
@lat = data["Item"][0]["DatumTky97"]["Lat"]
@lon = data["Item"][0]["DatumTky97"]["Lon"]

タイムアウト処理も何もしてないので実際にはあり得ないコードだが、とりあえずこれで緯度経度は取ってこれる。

後は表示用のHTMLがサンプルで掲載されているので、それをViewファイルにして、latとlotを渡してみる。

<html>
<head>
<script type="text/javascript" 
   src="http://map.yahooapis.jp/MapsService/js/V2/?appid=アプリケーションID">
</script>
<script type="text/javascript">
   window.onload=function(){
   _map = new YahooMapsCtrl("map", "<%=@lat%>,<%=@lon%>", 2);
}
</script>
<title>Yahoo!地図 サンプル</title>
</head>
<body>
<div id="map" style="height: 600px; width: 600px"></div>
</body>
</html>

これで目的の地図が表示される。注意点としては住所をescape処理して渡しているんだけど、渡す元の日本語文字列はUTF-8でないと受け付けない感じ。