google地图如何实现搜索功能？

chaney 2009-12-31 07:14:00

google.maps.LocalSearch()只能在地图上加搜索框，能否把搜索框移到外面来？

在页面上有3个html控件：
textbox button 及google的div
现在需要在textbox中输入信息（如：北京），点击button
然后google地图上即可显示北京的marker.

...全文

1104 17 打赏收藏转发到动态举报

写回复

用AI写文章

17 条回复

切换为时间正序

请发表友善的回复…

发表回复

cch444823055 2011-11-13

打赏
举报

感谢14楼的代码给了很大的帮助！！

豬哥 2011-08-17

打赏
举报

14楼得不错，帮忙顶下~！

1988始梦 2011-05-05

打赏
举报

顶一下，现在正在做这个

chaney 2010-03-01

打赏
举报

需求是：搜索google的数据库并显示结果，而不是搜索本地数据库再传入坐标显示结果。

ricecoder 2010-03-01

打赏
举报

一下是Google Map API的一个搜索例子：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps JavaScript API Example: Extraction of Geocoding Data</title>
<script src="http://maps.google.com/maps?file=api&v=2.x&key=ABQIAAAAzr2EBOXUKnm_jVnk0OJI7xSosDVG8KKPE1-m51RBrvYughuyMxQ-i1QfUnH94QxWIa6N4U6MouMmBA"
type="text/javascript"></script>
<script type="text/javascript">

var map;
var geocoder;

function initialize() {
map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(30.256695,120.17395,true), 14);
map.enableScrollWheelZoom();//滑轮缩放
var smallMapControl = new GSmallMapControl();
var topRight = new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(10,10));
var bottomRight = new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,10));
map.addControl(smallMapControl, topRight);
geocoder = new GClientGeocoder();
}

// addAddressToMap() is called when the geocoder returns an
// answer. It adds a marker to the map with an open info window
// showing the nicely formatted version of the address and the country code.
function addAddressToMap(response) {
map.clearOverlays();
if (!response || response.Status.code != 200) {
alert("Sorry, we were unable to geocode that address");
} else {
place = response.Placemark[0];
point = new GLatLng(place.Point.coordinates[1],
place.Point.coordinates[0]);
map.setCenter(point,14);

// var optionss = new GMarkerOptions;
// optionss.title = 'here';
// optionss.icon = G_DEFAULT_ICON ;

marker = new GMarker(point);

map.addOverlay(marker);
marker.openInfoWindowHtml(place.address + '<br>' + '<b>Country code:</b> ' + place.AddressDetails.Country.CountryNameCode);
GEvent.addListener(marker,'click',function(){
marker.openInfoWindowHtml(place.address + '<br>' + '<b>Country code:</b> ' + place.AddressDetails.Country.CountryNameCode);
});
}
}

// showLocation() is called when you click on the Search button
// in the form. It geocodes the address entered into the form
// and adds a marker to the map at that location.
function showLocation() {
var address = document.forms[0].q.value;
geocoder.getLocations(address, addAddressToMap);
}

</script>
</head>

<body onload="initialize()">


<form action="#" onsubmit="showLocation(); return false;">
<p>
<b>Search for an address:</b>
<input type="text" name="q" value="" class="address_input" size="40" />
<input type="submit" name="find" value="Search" />
</p>
</form>
<div id="map_canvas" style="width: 1000px; height: 600px"></div>

</body>
</html>

chaney 2010-01-13