December 15, 2006 11:45 AM by funami

フナミタカオです。
昨日公開された、Yahoo!地図情報Webサービスですが、まずは、Googleと地図がどのくらい違うのかを見ることができるサンプルを作りました。

http://tatamilab.jp/~funami/yahoo/y_vs_g_map.html
・ジオコーディング（地名検索）して、見つかったら、その場所を表示する。
・縮尺をだいたい同じにして、地図と、航空写真をみることができる。
といったことが試せます。
・スクロールの同期にも対応しました。

はまりどころ（１）　YEventType

Yahoo!のほうは、リファレンスが日本語なのはありがたいのですが、ソースのサンプルがないので、ちょっとはまるところもありました。

_map = new YahooMapsCtrl("ymap", w2j(point), 4); _map.setVisibleSliderbar(true);

　　　//YEventType.が必要！
_map.addEvent(YEventType.LAYER_CHANGED, function() {
　　　showInfo();
　　　});

ひとつが、こちらのイベント指定時の引数。
http://tatamilab.jp/mt/mt.cgi?__mode=view&_type=entry&blog_id=1
新規エントリー | エントリー | たたみラボ_blog | Movable Type Publishing Platform
_map.addEventの第一引数に、イベントを指定します。、リファレンスにも、イベントの一覧があるのですが、

_map.addEvent(LAYER_CHANGED, function() {
　　　showInfo();
　　　});

このように、ただ、LAYER_CHANGEDとだけかくと、そんな定数はないよってエラーになります。
で、文字列？とおもって　”LAYER_CHANGED”　のように、ダブルクオーテーションつけるも動かなかったです。
実は、YEventType.LAYER_CHANGEDが正解です。
当然なのですが、クラス名もないとだめです。
でも、サンプルなしだと気がつかないこともありますよね。

はまりどころ（２）YLLPoint.latはメソッドではない

GoogleMapsで、緯度経度をあらわすには、GLatLngクラスを使いますが、lat,lngを取り出すにはメソッド使いますが

var point = new GLatLng(10,10); var lat = point.lat();

Yahoo!地図情報の場合は、メソッドではなくて、アトリビュートなので、括弧はいりません。

var point = new YLLPoint(10,10);
var lat = point.lat;

しかも、経度は google => lng ,Yahoo => lon と微妙に違うので気をつけましょう。

GMapsのZoomはY!ではLayerと呼ぶ

呼び方はともかく、Googleは数が大きくなるほど、詳細になるのですが、Yahoo!は逆で、小さいほうが詳しくなります。 縮尺のきり方が違うので、完全に同サイズで比較することは難しいのですが、 、Yahoo!地図情報と、GoogleMapsの地図を比較してみようで試してみてください。

同じようなこと、みなさん思いつきますよね

コメントもいただきました。どうもありがとうございます。

・双子地図 (Google Maps API ＋ Yahoo!地図情報Webサービス

・Google Map と Yahoo! Mapを比べてみよう! 双方ドラックするとお互い同期します。

関連記事

・ヤフー、「Yahoo!地図情報」のAPIを公開--マッシュアップサイトの構築可能に
・ヤフー、「Yahoo!地図情報」のAPIを公開--マッシュアップサイトの構築可能に

tags：WEBサービス  Yahoo!地図情報