たくさんのマーカーを設置したくなったとき、コード内にマーカー毎にaddOverlayを書いていては面倒になってきます。配列データにまとめて記述してもかまいませんが、やはり外部データを利用したくなってきます。他のアプリケーションと連携したりする場合にもやはり必要です。
幸いGoogle Maps APIには外部データを利用する枠組みがあらかじめ用意されています。これを使ってみましょう。
GXmlHttpを用いてXML文章取得用のHTTPクライアントオブジェクト(XmlHttpRequestクラスのインスタンス)を作成します。
var request = GXmlHttp.create();
openメソッドを用いてXML文章を取得します
request.open("GET", '(取得するXML文章のURL)', true);
次に、onreadystatechangeメソッドを使って取得した文章の処理方法を記述します。とりあえず難しいことは考えずに以下のように記述しましょう
request.onreadystatechange = function() {
if (request.readyState == 4) {
var xmlDoc = request.responseXML;
var markers = xmlDoc.documentElement.getElementsByTagName("m");
for (var i = 0; i < markers.length; i++) {
var point = new GPoint(parseFloat(markers[i].getAttribute("lng")),
parseFloat(markers[i].getAttribute("lat")));
var marker = new GMarker(point);
map.addOverlay(marker);
}
}
}
XML文章をパースし、タグ名がmの要素をmarkers配列に保存し、属性として記述された緯度、経度情報を取り出し、マーカーを追加するという処理です。
最後にsend(null)と書きます
request.send(null);
XML文章を用意しましょう。encodingにはXML文章を記述する文字コードを記入します
<?xml version="1.0" encoding="EUC-JP" ?> <d> <m lat="(緯度1)" lng="(経度1)"/> <m lat="(緯度2)" lng="(経度2)"/> ...位置情報が続く </d>
すでにブログとの連携が盛んに行われていますが、ここではWiki(PukiWiki)と連携させる方法を紹介してみたいと思います。
PukiWikiにはBugTrackというプラグインがあり、これはバグトラッキングの項目ごとにページを作り、さらにそれらのページから進捗や重要度を取り出してリストを表示するという機能を持っています。これをヒントに緯度、経度をコメントとして埋め込み、各ページとマップ上の位置をリンクさせるという連携を実現しました。
XMLデータをはかせるためにプラグインを作成します。参考にゲーセンマップで使っているプラグインを上げておきました。
| データ出力用 | |
| 新規登録用 |
先ほどのコードのXMLデータ取得部分でWikiのデータ出力用URLを用いるように変更する。 ゲーセンマップではhttp://www.starlancer.org/~riesz/gcmap/?cmd=gcmapのような出力をしています。
また、クリックしてマーカーをつけた場所を登録するためにgcmapnewを呼び出して緯度、経度をPukiWikiに渡しています。文字コードの処理が若干面倒です。