読者です 読者をやめる 読者になる 読者になる

ほんじゃら堂

めんどくさい仕事をラクにする作業自動化レシピ集

Google AJAX Search API でシンプルにローカル検索

IT系・技術系 Javascript jquery

Google AJAX Search API
http://code.google.com/intl/ja/apis/ajaxsearch/


ドキュメントに掲載されているサンプルでは備えつけのフォームや検索結果を表示する
ようになっているのだけど、Javascript内で検索処理を実行して
結果をJSONで処理する方法もあったので、そのサンプルを掲載しておく。


jQueryも使用している。

// 地図生成
var center = new google.maps.LatLng(37.67008923368245, -223.881025375);
var map = new google.maps.Map(document.getElementById("map"), {
zoom: 4,
center: center,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
// ローカル検索用サーチャーオブジェクト生成
var searcher = new google.search.LocalSearch();
// 検索範囲を設定
searcher.setCenterPoint(map.getCenter());
// 検索結果処理を定義(ここではマーカーを配置してる)
var markers = [];
searcher.setSearchCompleteCallback(self, function () {
/* このへんに既存のマーカー削除処理 */
$.each(searcher.results, function (i, result) {
var marker = new google.maps.Marker({
position: new google.maps.LatLng(parseFloat(result.lat), parseFloat(result.lng)),
map: map
});
result.marker = marker;
markers.push(marker);
});
});
// 検索を実行
searcher.execute('大阪城');