我一直在尋找的例子:限制谷歌地圖自動完成對英國的地址只
http://code.google.com/apis/maps/documentation/javascript/examples/places-autocomplete.html
,並已決定將其納入我的網站。
是否可以將地址限制爲英國地址?
我一直在尋找的例子:限制谷歌地圖自動完成對英國的地址只
http://code.google.com/apis/maps/documentation/javascript/examples/places-autocomplete.html
,並已決定將其納入我的網站。
是否可以將地址限制爲英國地址?
試試這個:
var input = document.getElementById('searchTextField');
var options = {
types: ['(cities)'],
componentRestrictions: {country: 'tr'}//Turkey only
};
var autocomplete = new google.maps.places.Autocomplete(input,options);
儘管系統中有一項功能請求可以這樣做,但您可以對結果設置「偏差」,但不能嚴格限制其找到的位置。它作爲參數傳遞給自動完成方法,作爲Google地圖邊界對象。那麼自動完成將有利於這些邊界內的位置。但是請注意,由於這不是一個硬邊界,因此如果邊界外的搜索匹配,它將返回那些邊界。
從我的用法來看,它似乎有點bug,可以使用一些改進 - 特別是考慮到邊界外的任何內容都沒有被鄰近標記標記,所以邊界外的一個區塊可能顯示爲1000英里外面,所以要確保你玩弄正確的界限。
正確答案是使用componentRestrictions,它允許您限制自動填充到國家,如Ercan的答案中所示。 –
正確。它已於2012年7月25日添加到API v3.9中。截至撰寫上述答案時,API在v3.6。這是Google對上述功能請求的回答。截至今天,v3.12是最低版本,因此這應該是任何API請求的標準。 –
你會這樣做的最好方法是查詢自己的位置API並將查詢的字符串附加到你的國家。或者,當然,使用geo-autocomplete jQuery plugin。
詹姆斯·阿爾迪是正確的:
http://code.google.com/apis/maps/documentation/javascript/places.html#places_autocomplete
var defaultBounds = new google.maps.LatLngBounds(
new google.maps.LatLng(49.00, -13.00),
new google.maps.LatLng(60.00, 3.00));
var acOptions = {
bounds: defaultBounds,
types: ['geocode']
};
它是作爲搜索達勒姆給北卡羅來納州達勒姆的第二個結果有點讓人討厭,不管你如何努力將其勸地區偏見 - 你可以將它設置爲視口地圖邊界,它仍然會嘗試建議NC狀態...... jQuery解決方案可以在這裏找到,但似乎沒有給出與v3 API一樣多的結果。 http://code.google.com/p/geo-autocomplete/
可以攔截JSONP結果由google.maps.places.Autocomplete功能恢復,並利用它們,你認爲合適,如按國家來限制和顯示結果。
基本上,您重新定義head元素上的appendChild方法,然後監視Google自動填充代碼插入到JSONP的DOM中的JavaScript元素。隨着JavaScript元素的添加,您可以重寫Google定義的JSONP回調函數,以訪問原始自動完成數據。
這是一個黑客攻擊的一位,在這裏去(我使用jQuery,但它沒有必要爲這個破解工作):
//The head element, where the Google Autocomplete code will insert a tag
//for a javascript file.
var head = $('head')[0];
//The name of the method the Autocomplete code uses to insert the tag.
var method = 'appendChild';
//The method we will be overriding.
var originalMethod = head[method];
head[method] = function() {
if (arguments[0] && arguments[0].src && arguments[0].src.match(/GetPredictions/)) { //Check that the element is a javascript tag being inserted by Google.
var callbackMatchObject = (/callback=([^&]+)&|$/).exec(arguments[0].src); //Regex to extract the name of the callback method that the JSONP will call.
var searchTermMatchObject = (/\?1s([^&]+)&/).exec(arguments[0].src); //Regex to extract the search term that was entered by the user.
var searchTerm = unescape(searchTermMatchObject[1]);
if (callbackMatchObject && searchTermMatchObject) {
var names = callbackMatchObject[1].split('.'); //The JSONP callback method is in the form "abc.def" and each time has a different random name.
var originalCallback = names[0] && names[1] && window[names[0]] && window[names[0]][names[1]]; //Store the original callback method.
if (originalCallback) {
var newCallback = function() { //Define your own JSONP callback
if (arguments[0] && arguments[0][3]) {
var data = arguments[0][4]; //Your autocomplete results
//SUCCESS! - Limit results here and do something with them, such as displaying them in an autocomplete dropdown.
}
}
//Add copy all the attributes of the old callback function to the new callback function. This prevents the autocomplete functionality from throwing an error.
for (name in originalCallback) {
newCallback[name] = originalCallback[name];
}
window[names[0]][names[1]] = newCallback; //Override the JSONP callback
}
}
//Insert the element into the dom, regardless of whether it was being inserted by Google.
return originalMethod.apply(this, arguments);
};
你的方法似乎非常有趣,也是唯一一個解決限制使用Google自己參數的區域的固有問題的方法。你能發佈一個完整的工作JSFiddle或類似的納入上述請?我很難理解它如何適用於Google的示例,並且一個完整的工作示例將非常有幫助。謝謝 –
只要改變谷歌域的地圖到您的國家域名,它會自動搜索您的國家內只:
因此: http://maps.google.com/maps/api/geocode/xml?address= {0} &傳感器=假&語言= EN
要: http://maps.google.nl/maps/api/geocode/xml?address= {0} &傳感器=假&語言= NL
嘗試這樣的事情。
// Change Bangalore, India to your cities boundary.
var bangaloreBounds = new google.maps.LatLngBounds(
new google.maps.LatLng(12.864162, 77.438610),
new google.maps.LatLng(13.139807, 77.711895));
var autocomplete = new google.maps.places.Autocomplete(this, {
bounds: bangaloreBounds,
strictBounds: true,
});
autocomplete.addListener('place_changed', function() {
});
這是正確的答案 –
componentRestrictions:{country:'gb'} //只會根據問題 – geedubb
限制英國,它應該是'types:['cities']',而不是'types:[' )']' – tirdadc