2008/05/21

Google Maps API ~追記~

2008/05/03にGoogle Maps APIを使ったときは、GoogleローカルのAPIの存在に気づいていなかったので、Googleローカルの検索結果をGoogle Mapsの情報ウィンドウ(吹き出し)で表示するように変更してみた。実行結果は以下の通り(画像で貼り付けています)。


追加したコードはだいたいこんな感じ。

// ローカルサーチオブジェクトを生成
var localSearch = new GlocalSearch();

// 検索終了時に呼ばれるコールバック関数を登録
localSearch.setSearchCompleteCallback(null, OnLocalSearch);

// とりあえず有楽町駅を基準にする
localSearch.setCenterPoint("有楽町駅");

// "全聚徳"で検索実行
localSearch.execute("全聚徳");

検索の実行が終了すると、上で指定したコールバック関数が呼ばれる。

// 検索終了時に呼ばれるコールバック関数
function OnLocalSearch()
{
  // 結果があれば
  if (localSearch.results.length > 0)
  {
    // 検索結果を情報ウィンドウに表示
    map.openInfoWindowHtml(latlng,       localSearch.results[0].html.innerHTML);
  }
}

※ 上のlatlngはGoogle Maps APIで取得してきた"全聚徳"の位置です。

検索結果はすでにHTML形式(1個のDIV要素になっている)で取得できるので、上の例ではそれをそのまま情報ウィンドウ(=地図上の吹き出し)渡している。中身をちょっと加工すればもっと見やすい表示にできるけど、面倒なので今回はそのまま。
 

0 件のコメント: