我在谷歌地图中添加了以下API链接:
override
在窗口加载事件映射加载时,使用<script type="text/javascript" src="http://maps.google.com/maps/api/js?Place=true&libraries=places"></script>
中硬编码指定的默认lat和long值。并且还有loadShowMap()
的注册文本框。
AutoComplete
根据自动完成功能,它提供匹配地址,如下面的屏幕所示:
Automatic Initializer Inheritance
然后我选择“Marketfair Mall,Skibo Road,Fayetteville,NC,United States”。然后在搜索按钮上单击下面的函数被调用。其中设置了初始标记和我们当前搜索的标记。
google.maps.event.addDomListener(window, 'load', loadShowMap);
function loadShowMap() {
var input = document.getElementById('txtSearch');
var autocomplete = new google.maps.places.Autocomplete(input);
var latlng = new google.maps.LatLng(41.4925374, -99.9018);
var myOptions = {
zoom: 11,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
geocoder = new google.maps.Geocoder();
mapgoogle = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
NewMapLoad(mapgoogle, geocoder, '');
$('#btnMapSearch').click(function () {
geocoder = new google.maps.Geocoder();
var address = $('#txtSearch').val();
deleteOverlays();
if (address != '') {
NewMapLoad(mapgoogle, geocoder, $('#txtSearch').val());
}
else { alert('Please enter a Location to Search'); }
});
}
对于该设置,在函数下面的地图上初始和搜索标记被调用:
function NewMapLoad(Nmapgoogle, geocoder, searchplace) {
var strAddr = "Hollywood, LA"
var strPopupDiv = "<table cellPadding='0' cellSpacing='0' style='width:100%;'> <tr><td>" + "Initial Point" + "</td></tr></table> ";
var strSearchDiv = "<table cellPadding='0' cellSpacing='0' style='width:100%;'> <tr><td>" + "Search Point" + "</td></tr></table> ";
var PointColor = "RED";
var OrglatLon = document.getElementById('hdnactlocation');
var Orglat = "", OrgLon = "";
if (OrglatLon != null && OrglatLon.value.split('|').length > 1) {
Orglat = OrglatLon.value.split('|')[0];
OrgLon = OrglatLon.value.split('|')[1];
}
else if (OrglatLon != null && OrglatLon.value.trim() != "") {
strAddr = OrglatLon.value;
}
AddMappointsNew(Orglat, OrgLon, strPopupDiv, geocoder, mapgoogle, PointColor, strAddr, "Initial Point");
if (searchplace != '' && searchplace.toLowerCase() != 'clone') {
AddMappointsNew('', '', strSearchDiv, geocoder, mapgoogle, "GREEN", searchplace, "Search Point");
}
if (searchplace.toLowerCase() == 'clone') {
AddMappointsNew(orglat, orglon, strSearchDiv, geocoder, mapgoogle, "GREEN", strAddr, "Search Point");
}
overlay = new google.maps.OverlayView();
overlay.draw = function () { };
overlay.setMap(mapgoogle);
}
但是只有在地图上设置的初始标记和从自动完成功能返回的地理编码地址才会出现错误“ZERO_RESULT”。
答案 0 :(得分:1)
如果您查看Places Autocomplete Example on Google Developers,您将看到您不需要两次Geocode,这实际上就是您正在做的事情。您运行实际返回Place的自动完成功能,然后您有一个搜索按钮,然后再次搜索该地址。
我已经汇总了一些您应该尝试here
的样本autocomplete.addListener('place_changed', function() {
var place = autocomplete.getPlace();
console.log(place);
if (!place.geometry) {
// User entered the name of a Place that was not suggested and
// pressed the Enter key, or the Place Details request failed.
window.alert("No details available for input: '" + place.name + "'");
return;
}
// If the place has a geometry, then present it on a map.
if (place.geometry.viewport) {
mapgoogle.fitBounds(place.geometry.viewport);
} else {
mapgoogle.setCenter(place.geometry.location);
mapgoogle.setZoom(17); // Why 17? Because it looks good.
}
marker = new google.maps.Marker({
map: mapgoogle,
anchorPoint: new google.maps.Point(0, -29)
});
marker.setIcon( /** @type {google.maps.Icon} */ ({
url: place.icon,
size: new google.maps.Size(71, 71),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(17, 34),
scaledSize: new google.maps.Size(35, 35)
}));
marker.setPosition(place.geometry.location);
marker.setVisible(true);
var address = '';
if (place.address_components) {
address = [
(place.address_components[0] && place.address_components[0].short_name || ''),
(place.address_components[1] && place.address_components[1].short_name || ''),
(place.address_components[2] && place.address_components[2].short_name || '')
].join(' ');
}
});