可以将Google Maps API v3页面连接到另一个页面吗？

我需要将地址列表放置在页面的左侧，右侧的Google Maps（API v3）（例如通过iframe）。所以，如果我点击父页面上的地址，Google Map会放大到右侧的这个地址。可以将Google Maps API v3页面连接到另一个页面吗？

它有可能吗？如果是的话，我可以在哪里阅读？或者你可以举一些例子。谢谢。

来源

2011-09-07 Ax.

你必须使用iframe吗？下面是一个例子：http://jsfiddle.net/2YQg6/

这里使用类似的技术一应用程序：Housing maps

来源

2011-09-07 19:43:24

非常感谢！你帮助我很好。也感谢ZenMaster。 –

不确定。

这里是一个粗略的例子（可以看出here以及）

<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
     <title>ExtJS Google Maps Integration</title> 

     <!-- Google Map API --> 
     <style type="text/css"> 
      html { height: 100% } 
      body { height: 100%; margin: 0; padding: 0 } 
      #map_canvas { height: 100% } 
     </style> 
     <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=false&region=US"></script> 

    </head> 
    <body> 
     <div id="map_canvas" style="width:50%; height:50%;"></div> 
     <input id="lat" type="text" value="40.714623"></input> 
     <input id="lng" type="text" value="-74.006605"></input> 

     <script> 
      var options = { 
      zoom: 15, 
      disableDefaultUI: true, 
      zoomControl: true, 
      zoomControlOptions: { 
      style: google.maps.ZoomControlStyle.SMALL, 
      position: google.maps.ControlPosition.TOP_LEFT 
      }, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
      }; 

      var map = new google.maps.Map(document.getElementById("map_canvas"), options); 

      function updateLatLng() 
      { 
       var lat = document.getElementById("lat").value; 
       var lng = document.getElementById("lng").value; 
       var latLng = new google.maps.LatLng(lat , lng); 
       map.setCenter(latLng); 
      } 

      function updateAddress() 
      { 
       var address = document.getElementById("address").value; 
       var geocoder = new google.maps.Geocoder(); 
       geocoder.geocode({ address: address }, function(results, status) 
       { 
        var latLng = new google.maps.LatLng(results[0].geometry.location.Pa, results[0].geometry.location.Qa); 
        map.setCenter(latLng ); 
       }); 
      } 
     </script> 

     <button type="button" onClick="updateLatLng()">Update</button> 
     <input id="address" type="text" value="NYC"></input> 
     <button type="button" onClick="updateAddress()">Update</button> 
    </body> 
</html>

在这个例子 - 你把一个纬度和经度值输入字段中（可能很容易被链接），然后点击更新。您可以更改这些值并查看它是否正确更新。在这种情况下，你必须将你的地址映射到纬度/经度值，然后从那里开始。

有一个额外的输入字段，你可以把你的文本地址 - 工作原理是一样的。

来源

2011-09-07 19:44:35 ZenMaster

可以将Google Maps API v3页面连接到另一个页面吗？

回答

相关问题