最後にGoogleMapsのジオコーダー「GClientGeocoder」を利用し、入力された住所の位置に地図を移動してマーカーを追加してみます。index.rhtml内のjavascriptを次のように修正し、住所からマップを表示するための「setCenterByAddress」ファンクションを追加します。
laszlodemo/app/views/main/index.rhtml（一部）
function load() {
if（GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl());
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
geocoder = new GClientGeocoder();
}
}
//アドレスからマップを設定（lzxからコール）
function setCenterByAddress(address) {
if（geocoder) {
geocoder.getLatLng(
address,
function(point) {
if(point) {
map.setCenter(point, 13);
var marker = new GMarker(point);
map.addOverlay(marker);
marker.openInfoWindowHtml(address);
}
}
);
}
}
次にLZXを修正し、グリッドが選択された時にこのファンクションを呼ぶように設定します。ここではrestgridのonselectイベント内で、JavaScriptを呼ぶためのLzBrowserのloadJS()メソッドを使用します。なお日本語に対応するため住所をエスケープしています。
main.lzx（一部）
（画像をクリックすると別ウィンドウに拡大図を表示します）
では「http://127.0.0.1:3000/main」をリロードしてください。このように表示され住所が入力された列を選択すると、入力された住所の位置にマップが移動しマーカーが追加されます。
図2：入力された住所の位置にマップが移動しマーカーが追加される （画像をクリックすると別ウィンドウに拡大図を表示します）
|
