Entries

Google Maps JavaScript API V2 からV3 への移行時メモ(1) イベント処理

書籍「Google Maps APIプログラミング入門」(アスキー・メディアワークス)
の中でV2仕様で書かれているサンプルをV3に移行してみようと思い、
いくつかのサンプルについてトライしてみました。
この書籍はV3に関しても詳しく書かれており、
そこを読めばV3で書けるようになりますが、
V2のソースを土台にしてGoogleのサイトにあるAPIリファレンスV3
を読みながら修正していくような方法を取ると、
旧ヴァージョンとの比較ができてとても勉強になります。

調査の過程で、UIイヴェントについてしっかりと覚える
必要のある箇所があったので
備忘録としてまとめておきたいと思います。


このテキストのP74 のプログラムをV3 に移行する際に
調査の必要性が出てきました。
このページのサンプルは、マウスでクリックした座標にマーカーと、
緯度経度を載せた情報ウィンドウを表示させるプログラムです。

地図上の任意の場所をクリックした時にonMapClicked()という
関数をコールして、その中でマーカーと情報ウィンドウを表示させる
処理を行っているのですが、V3で、この onMapClicked() に渡すパラメタの
仕様が変わっていることを知らず、悩んだ末にV3リファレンスを読み込むことで
やっと問題が解決しました。おそらく同様の箇所で悩んでいる
方がいらっしゃるのではないかと思います。

このコンテンツの「UI イベントの引数へのアクセス」の項を読むと、
イベント発生時にコールする関数に渡すパラメタについて
以下のように書かれています。

「... 一般に UI 'click' イベントは、クリックされた地図上の位置を示す
 latLng プロパティを含む MouseEvent を渡します。
...」

更にサンプルが載っているのですが、地図上に任意の点をクリックしたときに
何か処理をしたい場合には、こんな感じで書かれています。

google.maps.event.addListener(map, 'click', function(event) {
  placeMarker(event.latLng);

このサンプルでは即時関数を使っていますが、この無名関数function()に、
"event" が渡されています。
この変数 "event" が、MouseEvent型オブジェクトであり、
プロパティ"latLng"を持っているということです。


ただ、前述の書籍では、即時関数で書かずに独自の関数をコールしています。
そんな場合は、こんな感じで書けばよいのではないかと思います。
まず、初期関数(名称をinitialize()にすることが多いようですが...)の中で、
こんな感じでaddListenerを指定し、

google.maps.event.addListener(map, "click", onMapClicked);
("map"は、 new google.maps.Map()の戻り値です。)


onMapClicked()についてはこんな感じで書くと思います。
リファレンスに書かれているように、パラメタはMouseEvent型の
変数を1つ渡す形で書きます。
通常はこの値から緯度、経度の情報を取り出したい場合が多いはずなので、
例えばこんな感じで書くのでしょうか。

function onMapClicked(mouseEvent){

  var lat = mouseEvent.latLng.lat();
  .......
}


もちろん、このテーマについても書籍にはしっかりと書かれています。
ただ、こんな重い書籍を常に持ち歩く訳にはいかないので
ここにまとめておこうと思いました。

MouseEvent オブジェクトの仕様についてはこのページで勉強しましょう。
http://code.google.com/intl/ja/apis/maps/documentation/javascript/reference.html#MouseEvent

唐突ですが、Google Maps API for Flash が廃止になることが決定した
そうで、これはショックです。3D関係はどうなるのでしょう...。
https://groups.google.com/group/google-maps-api-japan/browse_thread/thread/47a0dc239be6bbe7?pli=1

スポンサーサイト
この記事に対してトラックバックを送信する(FC2ブログユーザー)
http://tadpolizemedia.blog118.fc2.com/tb.php/141-938d45d9

0件のトラックバック

0件のコメント

コメントの投稿

投稿フォーム
投稿した内容は管理者にだけ閲覧出来ます

Appendix

プロフィール

 二代目松四郎

Author: 二代目松四郎


「カメラと動画(+スチル写真)」
「音響と音楽」
「プログラミング」
を主なテーマに活動しています。
映画館と美術館と音楽ホールと
古い街並みが私の学校。

宮城県仙台市在住。

カテゴリー

ブログ内検索

ブロとも申請フォーム

この人とブロともになる

Counter