Yahoo!地図情報のAPI(3) -YahooAPI-
<<
作成日時 ： 2007/04/13 12:37
>>
トラックバック 0 / コメント 0
無料公開されている"Yahoo!地図情報"。
現在、地図のAPIを実験しており、デフォルトで関西圏が表示され拡大・縮小スライダーを実装している状態だ。
ちょうどAPIのことを調べていると、地図から緯度と経度を得る方法が公開されていたので取り入れてみた。
[参考] ->ITPro 第1回 「Yahoo!地図情報Webサービス」(1)
このサイトからそのまま今のソースに手をいれたのが下のソースだ。
</script>
<script type="text/javascript">
window.onload=function(){
_map = new YahooMapsCtrl("map", "34.41.26.484,135.30.17.939", 6);
_map.setVisibleSliderbar(true);
_map.setEnableWheelOperation(false)
}
</script>
↓
</script>
<script type="text/javascript">
window.onload=function(){
_map = new YahooMapsCtrl("map", "34.41.26.484,135.30.17.939", 6);
_map.setVisibleSliderbar(true);
_map.setEnableWheelOperation(false)
//マップ移動完了イベント
_map.addEvent(YEventType.MAP_MOVED, chkIdoKeido);
}
//座標算出表示関数
function chkIdoKeido() {
Center = _map.getCenter();
document.getElementById('lat').innerHTML = Center.lat;
document.getElementById('lng').innerHTML = Center.lon;
alert("latは" + Center.lat + "です\n" + "lngは" + Center.lon + "です");
}
</script>
追記した「YEventType.MAP_MOVED」はマップを移動させたときに呼び出される関数で、その下に追記したファンクションを呼び出している。
呼び出されるファンクションには「getCenter」で地図中央の座標を取得して、その座標をブラウザ上とアラートで表示されるようになっている。
Yahoo!地図のAPI使用例が数少ない中、座標を取得する方法がすぐに見つかっただけでなく他の動作をさせたいときに使用するファンクション例としても非常に良いサンプルだ。
|
