Google maps api v2 |店鋪查找器/定位器

Question

我有一個名爲「店鋪定位器」的網頁，使用谷歌地圖api v2。當你在這個頁面上時，這一切都很順利，但我想添加一個側邊欄表單輸入，以允許網站其他頁面上的用戶輸入地址，然後轉發到「商店定位器」頁面，並顯示其地圖/結果。

所以我的問題是這樣的：我如何修改下面的代碼，以便能夠將表單/位置數據發送到我網站上任何頁面的地圖api，並在我的商店定位器頁面上獲取結果？

任何幫助偉大的讚賞，因爲這是讓我瘋了！ S.（代碼下面;我已省略了API密鑰部分，所述主體的onload東西和XML/PHP的處理）

地圖代碼

var map; 
var geocoder; 

var iconN = new GIcon(); 
iconN.image = 'images/marker.png'; 
iconN.iconSize = new GSize(33, 12); 
iconN.iconAnchor = new GPoint(28, 43); 
iconN.infoWindowAnchor = new GPoint(65, 12); 

function load() { 
    if (GBrowserIsCompatible()) { 
    geocoder = new GClientGeocoder(); 
    map = new GMap2(document.getElementById('map')); 
    map.addControl(new GSmallMapControl()); 
    map.addControl(new GMapTypeControl()); 
    map.setCenter(new GLatLng(53.2415, -1.6809), 4); 
    } 
} 
function searchLocations() {  
    var address = document.getElementById('addressInput').value; 
    geocoder.getLatLng(address, function(latlng) { 
    if (!latlng) { 
     alert(address + ' not found'); 
    } else { 
    searchLocationsNear(latlng);   
    } 
    }); 
} 
function searchLocationsNear(center) { 
    var radius = document.getElementById('radiusSelect').value; 
    var searchUrl = 'xml/phpsqlsearch_genxml.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius; 
    GDownloadUrl(searchUrl, function(data) { 
     var xml = GXml.parse(data); 
     var markers = xml.documentElement.getElementsByTagName('marker'); 
     map.clearOverlays(); 
     var results = document.getElementById('results'); 
     results.innerHTML = ''; 
     if (markers.length == 0) { 
      results.innerHTML = '<div>No results found.</div>'; 
      map.setCenter(new GLatLng(53.2415, -1.6809), 4); 
     return; 
    } 

    var bounds = new GLatLngBounds(); 
    for (var i = 0; i < markers.length; i++) { 
     var name = markers[i].getAttribute('name'); 
     var address = markers[i].getAttribute('address'); 
     var distance = parseFloat(markers[i].getAttribute('distance')); 
     var point = new GLatLng(parseFloat(markers[i].getAttribute('lat')), 
           parseFloat(markers[i].getAttribute('lng'))); 
     var phone = markers[i].getAttribute('phone'); 
     var website = markers[i].getAttribute('website'); 
     var logo = markers[i].getAttribute('logo'); 

     var marker = createMarker(point, name, address, phone, website, logo); 
     map.addOverlay(marker); 
     var sidebarEntry = createSidebarEntry(marker, name, address, distance, phone, website, logo); 
     results.appendChild(sidebarEntry); 
     bounds.extend(point); 
    } 
    map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds)); 
    }); 
} 

function createMarker(point, name, address, phone) { 
    var marker = new GMarker(point, iconN); 
    var html = '<strong>' + name + '</strong> <br/>' + address + '<br />Tel: ' + phone; 
    GEvent.addListener(marker, 'click', function() { 
    marker.openInfoWindowHtml(html); 
    }); 
    return marker; 
} 

function createSidebarEntry(marker, name, address, distance, phone, website, logo) { 
    var div = document.createElement('div'); 
    var html = '<img src="images/stockist-logos/' + logo + '" height="102" alt="' + name + '" class="right" /> <h3>' + name + '</h3> <small>Distance: <strong>' + distance.toFixed(1) + ' miles</strong></small><br/><p>' + address + '</p><p>Tel: ' + phone + '</p>';  
    div.innerHTML = html;  
    GEvent.addDomListener(div, 'click', function() { 
     GEvent.trigger(marker, 'click'); 
    }); 
    GEvent.addDomListener(div, 'mouseover', function() { 
     div.style.backgroundColor = '#fff'; 
    }); 
    GEvent.addDomListener(div, 'mouseout', function() { 
     div.style.backgroundColor = '#f7f7f7'; 
    }); 
    return div; 
} 

形式/ HTML代碼

<form action="#" id="stockists" onsubmit="searchLocations()"> 
<label>Location: </label><input type="text" id="addressInput" /> 
<label>Distance (miles): </label> 
<select id="radiusSelect"> 
<option value="25" selected>25 </option> 
<option value="100">100 </option>       
<option value="200">200 </option> 
</select> 
<input type="submit" value="Search" />  
</form> 

Answer 1

在您的主要內容的一側放置一個表單，使表單發佈/到達您的處理頁面

<form action="posting_page.php" method="get" id="stockists"> 
<label>Location: </label><input type="text" id="addressInput" /> 
<label>Distance (miles): </label> 
<select id="radiusSelect"> 
<option value="25" selected>25 </option> 
<option value="100">100 </option>       
<option value="200">200 </option> 
</select> 
<input type="submit" value="Search" /> 
</form> 

然後使用PHP或JavaScript來獲取查詢字符串/表單值

function searchLocations() {  
    var address = <GETFROMPHP>; 
    geocoder.getLatLng(address, function(latlng) { 
    if (!latlng) { 
     alert(address + ' not found'); 
    } else { 
    searchLocationsNear(<GETFROMPHP>);   
    } 
    }); 
} 

PHP是不是我的主要開發語言，所以你需要查找如何獲得查詢字符串/表單值。您還可以將處理頁面上的輸入字段設置爲post/get中的值，以便不必更改腳本。讓我知道，如果你需要更多的幫助