如何把这个代码在V3，而不是V2地图

下面是代码：如何把这个代码在V3，而不是V2地图

<!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"> 

    <head> 
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/> 
    <title>Google Maps AJAX + MySQL/PHP Example</title> 
    <script src="http://maps.google.com/maps?file=api&v=2&key=abcdef" 
      type="text/javascript"></script> 

    <script type="text/javascript"> 
    //<![CDATA[ 
    var map; 
    var geocoder; 

    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(40, -100), 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 = '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 sidebar = document.getElementById('sidebar'); 
     sidebar.innerHTML = ''; 
     if (markers.length == 0) { 
     sidebar.innerHTML = 'No results found.'; 
     map.setCenter(new GLatLng(40, -100), 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 marker = createMarker(point, name, address); 
     map.addOverlay(marker); 
     var sidebarEntry = createSidebarEntry(marker, name, address, distance); 
     sidebar.appendChild(sidebarEntry); 
     bounds.extend(point); 
     } 
     map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds)); 
    }); 
    } 

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

    function createSidebarEntry(marker, name, address, distance) { 
     var div = document.createElement('div'); 
     var html = '<b>' + name + '</b> (' + distance.toFixed(1) + ')<br/>' + address; 
     div.innerHTML = html; 
     div.style.cursor = 'pointer'; 
     div.style.marginBottom = '5px'; 
     GEvent.addDomListener(div, 'click', function() { 
     GEvent.trigger(marker, 'click'); 
     }); 
     GEvent.addDomListener(div, 'mouseover', function() { 
     div.style.backgroundColor = '#eee'; 
     }); 
     GEvent.addDomListener(div, 'mouseout', function() { 
     div.style.backgroundColor = '#fff'; 
     }); 
     return div; 
    } 
    //]]> 

    </script> 
    </head> 

    <body onload="load()" onunload="GUnload()"> 
    Address: <input type="text" id="addressInput"/> 


    Radius: <select id="radiusSelect"> 

     <option value="25" selected>25</option> 
     <option value="100">100</option> 

     <option value="200">200</option> 

    </select> 

    <input type="button" onclick="searchLocations()" value="Search Locations"/> 
    <br/>  
    <br/> 
<div style="width:600px; font-family:Arial, 
sans-serif; font-size:11px; border:1px solid black"> 
    <table> 
    <tbody> 
     <tr id="cm_mapTR"> 

     <td width="200" valign="top"> <div id="sidebar" style="overflow: auto; height: 400px; font-size: 11px; color: #000"></div> 

     </td> 
     <td> <div id="map" style="overflow: hidden; width:400px; height:400px"></div> </td> 

     </tr> 
    </tbody> 
    </table> 
</div>  
    </body> 
</html>

来源

2011-06-23 Andrew

我建议你看这个IO talk和相应的live blog。有几个要点从谈话：

您不再需要地图API密钥，当你包括地图图书馆。你需要做的传感器参数（http://maps.google.com/maps/api/js?sensor=true）。
没有更多GBrowserCompatible。您将在v3中找到v2中已删除的一些实用程序类型函数。这是一个真正的映射库的范围之内，有各种其他地方更适合这种类型的功能可用（JQuery的等）
地图对象上的一些必填字段。 的mapTypeId，变焦 & 中心
的的GMap2在全局命名空间是现在google.maps.Map。
地图对象现在知道它所占用的覆盖。因此，添加重叠式&从地图上删除自己（这是V2的做法相反）。这样做是为了避免在地图对象腹胀（无需添加/删除各种覆盖功能），这反过来又降低了初始下载大小为图书馆。这也意味着如果你想从地图中删除它们，你需要跟踪你的覆盖图。
您现在可以将多个信息窗口添加到地图（第2版将您限制为单个全球信息窗）。

您正在使用GClientGeocoder，因此您需要检查替换件javascript geocoding API。

来源

2011-06-23 02:12:07 RedBlueThing

如何把这个代码在V3，而不是V2地图

回答

相关问题