要实现的搜索功能     比如:目的地    当输入目的地后点击 搜索 后谷歌地图就会显示出来目的地并且标记上。
  各位老大,希望给力呀。

解决方案 »

  1.   

    <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>   
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">   
    <html>   
        <head>   
        <title>地图检索</title>
         <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=true&amp;key=ABQIAAAAaJdpuhdAgNPX4zs0zOvvuhRWqz2PfVo4vXxMlzbThqFCf7cZgRSTbAUBQzazl9qrnS3sz-sTOLHpuA" type="text/javascript"></script>
    <script language="javascript" type="text/javascript">   
        function load() {     //加载地图   
            if (GBrowserIsCompatible()) {    
                var map = new GMap2(document.getElementById("map"));    
                map.addControl(new GSmallMapControl());    //放大缩小   
                map.addControl(new GMapTypeControl());     //地图种类   
                map.enableScrollWheelZoom();    //启用鼠标滚轮   
                map.setCenter(new GLatLng(39.9000, 116.3000), 6);   //地图坐标 三个参数分别为 "纬度" "经度" "比例尺"   
              
                function createMarker(point, address,name,tel) {  //创建标记内容及标记的鼠标事件   
                   var er = new GMarker(point);   
                   var html = '<div>'+   
                       '<a >Name:'+ name +'</a><br/>'+   
                       '<a >Address:'+address +'</a><br/>'+   
                       '<a >telephone:'+tel +'</a>'+   
                       '</div>';   
                   GEvent.addListener(er, "mouseover", function() {   
                       er.openInfoWindowHtml(html);   
                   });   
                   GEvent.addListener(er, "mouseout", function() {   
                       er.closeInfoWindow();   
                   });   
                   GEvent.addListener(er, "click", function() {   
                       map.setCenter(point, 12);    
                   });   
                   return er;   
               }   
               var point = new GLatLng(39.9000,116.3000);     //设置标记   
               map.addOverlay(createMarker(point,'beijing','sh','123456'));//加入标记   
           }     
       }       
    </script>   
        </head>   
        <body onload="load()">   
          欢迎您,<font color="blue">${user.name}</font>
          <hr>
         &nbsp;&nbsp;目的地:&nbsp;&nbsp;<input type="text" name="endaddress"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  <input type="button" value="搜索"/>
            <div id="map" style="width: 750px; height: 500px"></div>   
        </body>   
    </html>  
      

  2.   

    搜索例子
    <!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&amp;v=2.x&amp;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 er 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.Place[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 ;
        
      er = new GMarker(point);
        
        
      map.addOverlay(er);
      er.openInfoWindowHtml(place.address + '<br>' + '<b>Country code:</b> ' + place.AddressDetails.Country.CountryNameCode);
      GEvent.addListener(er,'click',function(){
      er.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 er to the map at that location.
      function showLocation() {
      var address = document.forms[0].q.value;
      geocoder.getLocations(address, addAddressToMap);
      }  </script>
      </head>  <body onload="initialize()">  <!-- Creates a simple input box where you can enter an address
      and a Search button that submits the form. //-->
      <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>
      

  3.   

    key 下载地址 http://code.google.com/apis/maps/signup.html
      

  4.   

    这个Google地图应该有API介绍的吧,关键就是获取你这地点的经纬度,根据经纬度再标点