それらのサイトを見てみると、GoogleMapsAPIはとても簡単に使えることがわかった。要するにGMapクラスで地図を生成し、GPolylineクラスで軌跡を定義して、addOverlay()メソッドで重ね書きするだけのことだ。やってみるととても簡単。GoogleMapsEditorの作者に使用許可をもらおうかと思っていたが、そんなことをするまでもなくオリジナルで作った方が早い。やっぱり著作権がらみの問題はない方がいいし・・。
マーカーをクリックすると説明が吹き出しで表示されるのは、GMarkerクラスのopenInfoWindowHtml()メソッドを使えば簡単にできる。引数にはHTMLで記述された文字列を渡せばいいだけ。
ただこういうのはオブジェクト指向の概念がわかってない人にはすごくわかりにくいと思う。マーカーをクリックすると説明が表示されるというのは具体的にはどういう仕組みで実現されているのかちょっと解説してみよう。以下はマーカーを一つ表示し、クリックするとメッセージが表示されるサンプルの主要部分だ。
var map = new GMap(document.getElementById("map"));
var marker = new GMarker(new GPoint(135.832987, 34.684464));
map.addOverlay(marker);
GEvent.addListener(marker, "click", function() {
var msg = "ここに説明文を記述する";
marker.openInfoWindowHtml(msg);
});
最初の行では地図を表すインスタンスを生成する。具体的にはdivタグのid="map"で指定された地図表示領域をgetElementById()メソッドで取得してGMapクラスのコンストラクタに渡している。クラスとインスタンスはちょうど設計図と製品の関係であって、具体的な「もの」を表すのがインスタンスなのだ。もっと平たく言えば、たこ焼きの「型」と「たこ焼き」と言うべきか？ 一つのクラスからインスタンスはいくらでも作れるのであって、それを区別するために変数を使って一つ一つに名前を付ける。"var"は変数の宣言文である。ここでは"map"という変数が一つの地図を表すインスタンスである。なおクラスからインスタンスを作り出すものがnew演算子とコンストラクタである。コンストラクタには適当な引数を与えることにより、インスタンスの初期化を行う。
その次の行では座標をGPointクラスのインスタンスで与えて、マーカーを一つ生成している。引数は経度と緯度の順だ。これは何となくわかるだろう。ここでマーカーのインスタンスは"marker"という変数で表される。もちろん、マーカーがたくさんあるときは変数名で区別しなければならない。
次の行のmap.addOverlay(marker)でGMapクラスに用意されているaddOverlay()メソッドを呼び出し、先ほど生成したマーカーを地図上に重ね書き（オーバーレイ）する。ここでピリオドの後ろにaddOverlay()が来ることに戸惑う人が多いだろう。ここがCやBasicなどの手続き型言語に慣れている人には取っつきにくい部分だ。オブジェクト指向の考え方では、すべてのメソッド（つまり手続き）はオブジェクト自身に内包されているのであって、そのメソッドを呼び出すインスタンスを明示しなければならない。ピリオドはどのインスタンスに対してメソッドを呼び出すのかを表し、対象となるインスタンスが必ずピリオドの左側に来る。日本語ではピリオドを「〜に対して」と読み替えるとわかりやすいだろう。
そして一番わかりにくいのが最後のGEvent.addListener()メソッドである。まずこれはクラスそのものに属するメソッドであるため、対象となるインスタンスが存在しない。したがってクラス名そのものにピリオドを付けて呼び出すのである。そしてリスナーとは、何らかのイベント（つまりクリックなど）に対してどのような反応をするべきかを定義する部分である。この場合は、マーカーをクリックされたらメッセージを表示するという動作をしたいわけだ。引数として与えなければならないのは、対象となるインスタンス、イベントの種類、実行すべき関数の３つである。この場合、"marker"というインスタンスに対して"click"されたときに、function()で定義される関数が実行されるわけだ。本来３つめの引数にはあらかじめ定義された関数名を記述するのだが、ここでは無名の関数の定義を同時にやってしまっていると考えればよい。Javaで言うところの匿名クラスと非常によく似た考え方である。この無名関数の中で"marker"インスタンスに対してopenInfoWindowHtml()メソッドを呼び出すことにより、説明を吹き出し表示させるわけだ。メソッドの引数には変数msgに代入したHTML文を渡している。
とりあえず今日はGoogleMaps形式でトラックログを出力させ、軌跡を表示するところまでうまく行った。あとはウェイポイントの情報を読み込んでマーカーを表示させ、必要な情報を付加する部分を作ればよい。操作性としてはGoogleMapsEditorと似たようなものになるだろう。
完成間近って感じですね(^-^)
期待しとります♪
今日は二日酔いで未だに気分悪いです(^-^;
2006.03.07 18:15 URL | racchi #lMBqkpAs [ 編集 ]
これからが大変なんですよ。
いつも詰めが甘いって言われるので・・(^_^;
2006.03.07 20:29 URL | windy #4ARdecsc [ 編集 ]
すばらしいですね〜。自分があれこれいじるよりも、windyさんのツールができあがるのを待ったほうが早そうです！？新しいツールは、GoogleMapsEditorよりもスペック的には完全に上位になるのでしょうか？もしできあがったら、大々的に宣伝したいですね。アクセス急増、アドセンスのクリック量も激増！？
2006.03.08 22:05 URL | かくげ太 #MzDNG6Lo [ 編集 ]
実は原形としてはもう出来上がっています。.TRKファイルと.WPTファイルを読み込んでトラックとマーカーアイコンを表示するところまではできました。クリックしたらちゃんと説明が出ます。
ただ現段階では機能の検証だけであって、いろいろ設定することは何もできません。自分以外には誰も使えない状態ですね。プログラムで一番時間のかかるのはユーザーインターフェースの部分なのです。できるだけ柔軟性を持たせて、かつ操作が簡単であるようにするのはいろいろ頭を使います。
GoogleMapsEditorとは方向性が違うと思っています。GoogleMapsEditorはゼロからポイントを入力していくのが基本ですが、当該ソフトではカシミールと組み合わせて使うのが基本で、データを新規に登録することはできません。編集機能などはそれほど入れないつもりです。
まあ当面は最小限の機能で公開しておいて、後からバージョンアップしていくことになるでしょう。結果としてGoogleMapsEditorの機能を包含することになる可能性はありますが・・。
金が取れるようなソフトではありませんが、アクセスの増加は見込めるだろうと思います。アドセンスのクリック量が増えたらそれだけで結構な収入になりますしね・・。ついでに仕事の依頼も来たらラッキーなのですが。(^_^;
トラックバックURL↓
http://wadati.blog10.fc2.com/tb.php/344-cd45d8d1
Calendar
