google maps api document 中文翻译
点击次数：50 次 发布日期：2008-11-12 16:40:06 作者：源代码网
|
google maps api document 中文翻译- - 源代码网推荐 Tag： API,MAPS,GOOGLE 源代码网推荐 Google Maps API 源代码网推荐 可以让你在你自己的网页上嵌入google地图。要使用这个API,你需要上这里去 源代码网推荐 http://www.google.com/apis/maps/signup.htm 源代码网推荐 申请一个API key 并按照下面的说明来做。 源代码网推荐 源代码网推荐 源代码网推荐 这个API是新的，所以以完美的文档的要求来说，它可能会有一些小错误。容忍我们，我们将填补这些漏洞，您可以参加这个 源代码网推荐 Google Maps API 中文讨论区 源代码网推荐 http://groups.google.com/group/Goolgle-Map-Chinese 源代码网推荐 地图讨论组来反馈您的问题并讨论这个API。 源代码网推荐 正文如下： 源代码网推荐 介绍： 源代码网推荐 Google Maps的"helloword"程序 源代码网推荐 浏览器的选择 源代码网推荐 XHTML和VML 源代码网推荐 API更新 源代码网推荐 地理编码，路径选择等 源代码网推荐 例子： 源代码网推荐 最基本的 源代码网推荐 地图移动和动画 源代码网推荐 向地图中添加控件 源代码网推荐 事件监听 源代码网推荐 打开一个属性窗口 源代码网推荐 地图叠置 源代码网推荐 单击操作 源代码网推荐 在标记上的窗口显示信息 源代码网推荐 创建图标 源代码网推荐 使用图标类 源代码网推荐 在地图上使用XML和异步传输RPC（"AJAX"） 源代码网推荐 API 总览 源代码网推荐 GMap 类（the GMap class） 源代码网推荐 事件 （Event） 源代码网推荐 信息窗口（the info window） 源代码网推荐 叠置（Overlays） 源代码网推荐 图标和标记（Icons and Markers） 源代码网推荐 折线（Polylines） 源代码网推荐 控件（Controls） 源代码网推荐 XML 和 RPC 源代码网推荐 类参考 源代码网推荐 GMap 源代码网推荐 * Constructor 源代码网推荐 * Methods 源代码网推荐 * Configuration 源代码网推荐 * Controls 源代码网推荐 * State 源代码网推荐 * Overlays 源代码网推荐 * Info Window 源代码网推荐 * Event 源代码网推荐 源代码网推荐 源代码网推荐 GMarker 源代码网推荐 * Constructor 源代码网推荐 * Methods 源代码网推荐 * Events 源代码网推荐 GPloyLine 源代码网推荐 * Constructor 源代码网推荐 源代码网推荐 源代码网推荐 GIcon 源代码网推荐 * Constructor 源代码网推荐 * Properties 源代码网推荐 源代码网推荐 源代码网推荐 GEvent 源代码网推荐 * Static Methods 源代码网推荐 源代码网推荐 源代码网推荐 GXmlHttp 源代码网推荐 * Static Methods 源代码网推荐 源代码网推荐 源代码网推荐 GXml 源代码网推荐 * Static Methods 源代码网推荐 GXslt 源代码网推荐 * Static Methods 源代码网推荐 * Methods 源代码网推荐 源代码网推荐 源代码网推荐 GPoint 源代码网推荐 * Constructor 源代码网推荐 * Properties 源代码网推荐 源代码网推荐 源代码网推荐 GSize 源代码网推荐 * Constructor 源代码网推荐 * Propertes 源代码网推荐 GBounds 源代码网推荐 * Constructor 源代码网推荐 * Properties 源代码网推荐 简介： 源代码网推荐 Google Maps 的"hello world"实例 源代码网推荐 源代码网推荐 源代码网推荐 最简单的开始学习这个API的方法是看一个简单的例子。。这个网页显示了以Palo 源代码网推荐 源代码网推荐 源代码网推荐 Alto为中心的一个300×300的地图 源代码网推荐 <!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> 源代码网推荐 <title>Google Maps JavaScript API Example - simple</title> 源代码网推荐 <script 源代码网推荐 src="http://maps.google.com/maps?file=api&v=1&key=abcdefg"type="text/javascript"></script> 源代码网推荐 源代码网推荐 源代码网推荐 </head> 源代码网推荐 <body> 源代码网推荐 <div id="map" style="width: 300px; height: 300px"></div> 源代码网推荐 <script type="text/javascript"> 源代码网推荐 //<![CDATA[ 源代码网推荐 if (GBrowserIsCompatible()) { 源代码网推荐 var map = new GMap(document.getElementById("map")); 源代码网推荐 map.centerAndZoom(new GPoint(-122.141944, 37.441944), 4); 源代码网推荐 } 源代码网推荐 //]]> 源代码网推荐 </script> 源代码网推荐 </body> 源代码网推荐 </html> 源代码网推荐 你可以把这个例子下载下来并编辑和测试它，但是你需要将"abcdefg"替换成你自己的Maps 源代码网推荐 源代码网推荐 源代码网推荐 API key，让这个例子能在你自己的网站上运行。 源代码网推荐 正如你在上面的例子中所看到的，Google 源代码网推荐 Maps引入了一个简单的javascript 源代码网推荐 url（http://maps.google.com/maps?file=api&v=1）,这个url包含了所有的在你的网页上创建地图的所需要的标记和符号。要使用Google 源代码网推荐 源代码网推荐 源代码网推荐 Maps 源代码网推荐 Api，你需要去创建一个简单的script标记来指向这个url，当然要加上你从google那里申请来的这个API的key。 源代码网推荐 源代码网推荐 源代码网推荐 <script 源代码网推荐 src="http://maps.google.com/maps?file=api&v=1&key=abcdefg"type="text/javascript"></script> 源代码网推荐 源代码网推荐 源代码网推荐 Google Maps 源代码网推荐 API输出的最主要的类是GMap类，它表现了一个网页上的简单的地图。你可以创建更多的这个类的实例（每个实例来表网页上的一个地图）。地图被嵌入到一个容器­-中，一般是一个div元素。 源代码网推荐 源代码网推荐 源代码网推荐 操纵和叠置图层到地图实例的方法会在下面详细介绍。 源代码网推荐 源代码网推荐 源代码网推荐 浏览器兼容性 源代码网推荐 Google Maps并不对所有的浏览器兼容。现在Google 源代码网推荐 Maps支持的浏览器版本有Firefox/Mozilla,IE5.5以上版本，Safari1.2以上版本部分支持Opera。它不支持IE5.0。由于不­-同的应用要求用户对不同的浏览器作不同的操作，Maps 源代码网推荐 源代码网推荐 源代码网推荐 API提供了一个globle 源代码网推荐 方法（GBrowserIsCompatible（））来检查兼容性，但是它没有任何自动的针对不同浏览器的行为。 源代码网推荐 源代码网推荐 源代码网推荐 脚本http://maps.google.com/maps?file=api&v=1将在几乎所有的浏览器上被正确解析，所以你可以在检查兼容性之前安全地将这个脚本引入进来。 源代码网推荐 源代码网推荐 源代码网推荐 除了上面的例子检测了兼容性外，本文档中的所有例子都没有检测兼容性，对于老的浏览器，他们也不会提示任何信息。显然，真正的应用中应该将事情做得更好，但是我­-们忽略了这些检查来让我们的例子更容易读。 源代码网推荐 源代码网推荐 源代码网推荐 XHTML 和 VML 源代码网推荐 我们推荐您再包含地图的网页上使用符合标准的XHTML。当浏览器检测到在页首的DOCTYPE标签时，它们将使用符合标准的模式来执行你的网页，这样可以使得­-在不同的浏览器上的布局和行为更加的可预料一些。 源代码网推荐 源代码网推荐 源代码网推荐 同样的，如果你在你的地图上要包含PLOYLINE，对于IE浏览器你需要在你的XHTML文档中引入VML名称空间。你的HTML文档应该这样开始： 源代码网推荐 源代码网推荐 源代码网推荐 <!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> 源代码网推荐 <style type="text/css"> 源代码网推荐 v:* { 源代码网推荐 behavior:url(#default#VML); 源代码网推荐 } 源代码网推荐 </style> 源代码网推荐 <script 源代码网推荐 src="http://maps.google.com/maps?file=api&v=1&key=abcdefg"type="text/javascript"></script> 源代码网推荐 源代码网推荐 源代码网推荐 </head> 源代码网推荐 查看Microsoft VML workshop可以得到更多信息。 源代码网推荐 API 的更新 源代码网推荐 URl 源代码网推荐 http://maps.google.com/maps?file=api&v=1代表API的"1.0"版本。当我们要对这个API作出重大更新的时候，我们将增加版本号并在GOOGLE 源代码网推荐 源代码网推荐 源代码网推荐 CODE和MAP API讨论组发表通告。 源代码网推荐 我们将尝试同时运行新版本和旧版本，一个月后，老的版本就会被停用。 源代码网推荐 源代码网推荐 源代码网推荐 Maps团队将透明地更新API，包括增强它地性能，修复它的bugs。这些bugs修复工作只是为了提高性能和填补漏洞，但是我们可能会不经意地破坏一些AP­-I客户，请在Maps 源代码网推荐 源代码网推荐 源代码网推荐 API讨论组中报告这些情况。 源代码网推荐 地理编码，路径，等等 源代码网推荐 Google Maps 源代码网推荐 API还没有包含地理编码和路由服务，但网罗上有很多的免费的地理编码。 源代码网推荐 源代码网推荐 源代码网推荐 示例： 源代码网推荐 the basics 源代码网推荐 创建一副地图并将其中心定位在Palo Alto； 源代码网推荐 var map = new GMap(document.getElementById("map")); 源代码网推荐 map.centerAndZoom(new GPoint(-122.141944, 37.441944), 4); 源代码网推荐 map movement and animation 源代码网推荐 源代码网推荐 源代码网推荐 recenterOrPanToLatLng方法进行一个持续的漫游，如果经纬度范围不在当前的地图窗口中的话，另外它还可以进行一个离散的移动。 源代码网推荐 源代码网推荐 源代码网推荐 var map = new GMap(document.getElementById("map")); 源代码网推荐 map.centerAndZoom(new GPoint(-122.1419, 37.4419), 4); 源代码网推荐 window.setTimeout(function() { 源代码网推荐 map.recenterOrPanToLatLng(new GPoint(-122.1569, 37.4569)); 源代码网推荐 }, 2000); 源代码网推荐 Adding Controls to the Map 源代码网推荐 源代码网推荐 源代码网推荐 你可以使用addControl方法往地图上添加控件。在这个例子中，我们添加了GSmallMapControl和GMapTypeControl，折使得我­-们能够缩放，漫游地图并在地图和卫星影像之间做切换。 源代码网推荐 源代码网推荐 源代码网推荐 var map = new GMap(document.getElementById("map")); 源代码网推荐 map.addControl(new GSmallMapControl()); 源代码网推荐 map.addControl(new GMapTypeControl()); 源代码网推荐 map.centerAndZoom(new GPoint(-122.141944, 37.441944), 4); 源代码网推荐 Event Listeners 源代码网推荐 源代码网推荐 源代码网推荐 事件监听器在GEvent.addListener方法中注册。在这个例子中，在用户将地图移动或者拖动以后，我们会返回地图的中间的经纬度坐标。 源代码网推荐 源代码网推荐 源代码网推荐 var map = new GMap(document.getElementById("map")); 源代码网推荐 GEvent.addListener(map, "moveend", function() { 源代码网推荐 var center = map.getCenterLatLng(); 源代码网推荐 var latLngStr = "(" + center.y + ", " + center.x + ")"; 源代码网推荐 document.getElementById("message").innerHTML = latLngStr; 源代码网推荐 }); 源代码网推荐 map.centerAndZoom(new GPoint(-122.141944, 37.441944), 4); 源代码网推荐 打开一个消息窗口(opening an info window) 源代码网推荐 显示一个指向地图中间的"hello 源代码网推荐 world"信息窗口。信息窗口一般的会在标签上方被打开,但是他们也可以在地图的任何地方被打开。 源代码网推荐 源代码网推荐 源代码网推荐 var map = new GMap(document.getElementById("map")); 源代码网推荐 map.centerAndZoom(new GPoint(-122.141944, 37.441944), 4); 源代码网推荐 map.openInfoWindow(map.getCenterLatLng(), 源代码网推荐 document.createTextNode("Hello world")); 源代码网推荐 地图叠加(Map Overlays) 源代码网推荐 创建了十个随机的标记和一个随机的折线来展示map 源代码网推荐 overlays的用途 源代码网推荐 // Center the map on Palo Alto 源代码网推荐 var map = new GMap(document.getElementById("map")); 源代码网推荐 map.addControl(new GSmallMapControl()); 源代码网推荐 map.addControl(new GMapTypeControl()); 源代码网推荐 map.centerAndZoom(new GPoint(-122.141944, 37.441944), 4); 源代码网推荐 // Add 10 random markers in the map viewport using the default icon 源代码网推荐 var bounds = map.getBoundsLatLng(); 源代码网推荐 var width = bounds.maxX - bounds.minX; 源代码网推荐 var height = bounds.maxY - bounds.minY; 源代码网推荐 for (var i = 0; i < 10; i++) { 源代码网推荐 var point = new GPoint(bounds.minX + width * Math.random(), 源代码网推荐 bounds.minY + height * Math.random()); 源代码网推荐 var marker = new GMarker(point); 源代码网推荐 map.addOverlay(marker); 源代码网推荐 源代码网推荐 源代码网推荐 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 // Add a polyline with 4 random points. Sort the points by longitude so 源代码网推荐 源代码网推荐 that 源代码网推荐 // the line does not intersect itself. 源代码网推荐 var points = []; 源代码网推荐 for (var i = 0; i < 5; i++) { 源代码网推荐 points.push(new GPoint(bounds.minX + width * Math.random(), 源代码网推荐 bounds.minY + height * Math.random())); 源代码网推荐 源代码网推荐 源代码网推荐 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 points.sort(function(p1, p2) { return p1.x - p2.x; }); 源代码网推荐 map.addOverlay(new GPolyline(points)); 源代码网推荐 单击操作(Click Handling). 源代码网推荐 源代码网推荐 当你点击地图的时候，你往那个点上面添加了一个标记。当你再次点击这个点的时候，你将这个点从地图上抹掉了。 源代码网推荐 源代码网推荐 源代码网推荐 var map = new GMap(document.getElementById("map")); 源代码网推荐 map.addControl(new GSmallMapControl()); 源代码网推荐 map.addControl(new GMapTypeControl()); 源代码网推荐 map.centerAndZoom(new GPoint(-122.141944, 37.441944), 4); 源代码网推荐 GEvent.addListener(map, "click", function(overlay, point) { 源代码网推荐 if (overlay) { 源代码网推荐 map.removeOverlay(overlay); 源代码网推荐 } else if (point) { 源代码网推荐 map.addOverlay(new GMarker(point)); 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 源代码网推荐 }); 源代码网推荐 源代码网推荐 源代码网推荐 在标记上显示消息窗口(Display Info windows Above Markers) 源代码网推荐 在这个示例中，我们通过监听对每个标记的单击事件来显示一个定义的消息窗口，我们使用了关闭窗口的功能来对每个窗口的内容进行用户化的定制。 源代码网推荐 源代码网推荐 // Center the map on Palo Alto 源代码网推荐 var map = new GMap(document.getElementById("map")); 源代码网推荐 map.addControl(new GSmallMapControl()); 源代码网推荐 map.addControl(new GMapTypeControl()); 源代码网推荐 map.centerAndZoom(new GPoint(-122.141944, 37.441944), 4); 源代码网推荐 // Creates a marker whose info window displays the given number 源代码网推荐 function createMarker(point, number) { 源代码网推荐 var marker = new GMarker(point); 源代码网推荐 // Show this marker"s index in the info window when it is clicked 源代码网推荐 var html = "Marker #<b>" + number + "</b>"; 源代码网推荐 GEvent.addListener(marker, "click", function() { 源代码网推荐 marker.openInfoWindowHtml(html); 源代码网推荐 }); 源代码网推荐 return marker; 源代码网推荐 源代码网推荐 源代码网推荐 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 // Add 10 random markers in the map viewport 源代码网推荐 var bounds = map.getBoundsLatLng(); 源代码网推荐 var width = bounds.maxX - bounds.minX; 源代码网推荐 var height = bounds.maxY - bounds.minY; 源代码网推荐 for (var i = 0; i < 10; i++) { 源代码网推荐 var point = new GPoint(bounds.minX + width * Math.random(), 源代码网推荐 bounds.minY + height * Math.random()); 源代码网推荐 var marker = createMarker(point, i + 1); 源代码网推荐 map.addOverlay(marker); 源代码网推荐 源代码网推荐 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 创建图标 源代码网推荐 创建一个新类型的图标，使用在Google Ride 源代码网推荐 Finder中的"mimi"标记作为例子。我们需要制定 源代码网推荐 这个图像的前景图像，阴影图像,以及我们想要将这些图标放在地图上的位置和和这些图标相对应的 源代码网推荐 源代码网推荐 信息窗口。 源代码网推荐 // Create our "tiny" marker icon 源代码网推荐 var icon = new GIcon(); 源代码网推荐 icon.image = "http://labs.google.com/ridefinder/images/mm_20_red.png"; 源代码网推荐 icon.shadow = 源代码网推荐 "http://labs.google.com/ridefinder/images/mm_20_shadow.png"; 源代码网推荐 icon.iconSize = new GSize(12, 20); 源代码网推荐 icon.shadowSize = new GSize(22, 20); 源代码网推荐 icon.iconAnchor = new GPoint(6, 20); 源代码网推荐 icon.infoWindowAnchor = new GPoint(5, 1); 源代码网推荐 // Center the map on Palo Alto 源代码网推荐 var map = new GMap(document.getElementById("map")); 源代码网推荐 map.addControl(new GSmallMapControl()); 源代码网推荐 map.addControl(new GMapTypeControl()); 源代码网推荐 map.centerAndZoom(new GPoint(-122.141944, 37.441944), 4); 源代码网推荐 // Creates one of our tiny markers at the given point 源代码网推荐 function createMarker(point) { 源代码网推荐 var marker = new GMarker(point, icon); 源代码网推荐 map.addOverlay(marker); 源代码网推荐 GEvent.addListener(marker, "click", function() { 源代码网推荐 marker.openInfoWindowHtml("You clicked me!"); 源代码网推荐 }); 源代码网推荐 源代码网推荐 源代码网推荐 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 // Place the icons randomly in the map viewport 源代码网推荐 var bounds = map.getBoundsLatLng(); 源代码网推荐 var width = bounds.maxX - bounds.minX; 源代码网推荐 var height = bounds.maxY - bounds.minY; 源代码网推荐 for (var i = 0; i < 10; i++) { 源代码网推荐 createMarker(new GPoint(bounds.minX + width * Math.random(), 源代码网推荐 bounds.minY + height * Math.random())); 源代码网推荐 源代码网推荐 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 使用图标类(Using Icon Classes) 源代码网推荐 源代码网推荐 在很多种情况下，你的图标也许会有相同的前景色，但可能有不同的形状和阴影。最简单的达到 源代码网推荐 源代码网推荐 源代码网推荐 这种效果的方法是使用GIcon 源代码网推荐 类的拷贝，这些拷贝将你所要定义的图标属性都拷贝到一个你所定义的 源代码网推荐 源代码网推荐 源代码网推荐 新的图标上去。 源代码网推荐 // Create a base icon for all of our markers that specifies the shadow, 源代码网推荐 源代码网推荐 源代码网推荐 icon 源代码网推荐 // dimensions, etc. 源代码网推荐 var baseIcon = new GIcon(); 源代码网推荐 baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png"; 源代码网推荐 baseIcon.iconSize = new GSize(20, 34); 源代码网推荐 baseIcon.shadowSize = new GSize(37, 34); 源代码网推荐 baseIcon.iconAnchor = new GPoint(9, 34); 源代码网推荐 baseIcon.infoWindowAnchor = new GPoint(9, 2); 源代码网推荐 baseIcon.infoShadowAnchor = new GPoint(18, 25); 源代码网推荐 // Center the map on Palo Alto 源代码网推荐 var map = new GMap(document.getElementById("map")); 源代码网推荐 map.addControl(new GSmallMapControl()); 源代码网推荐 map.addControl(new GMapTypeControl()); 源代码网推荐 map.centerAndZoom(new GPoint(-122.141944, 37.441944), 4); 源代码网推荐 // Creates a marker whose info window displays the letter corresponding 源代码网推荐 源代码网推荐 源代码网推荐 to 源代码网推荐 // the given index 源代码网推荐 function createMarker(point, index) { 源代码网推荐 // Create a lettered icon for this point using our icon class from 源代码网推荐 above 源代码网推荐 var letter = String.fromCharCode("A".charCodeAt(0) + index); 源代码网推荐 var icon = new GIcon(baseIcon); 源代码网推荐 icon.image = "http://www.google.com/mapfiles/marker" + letter + 源代码网推荐 ".png"; 源代码网推荐 var marker = new GMarker(point, icon); 源代码网推荐 // Show this marker"s index in the info window when it is clicked 源代码网推荐 var html = "Marker <b>" + letter + "</b>"; 源代码网推荐 GEvent.addListener(marker, "click", function() { 源代码网推荐 marker.openInfoWindowHtml(html); 源代码网推荐 }); 源代码网推荐 return marker; 源代码网推荐 源代码网推荐 源代码网推荐 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 // Add 10 random markers in the map viewport 源代码网推荐 var bounds = map.getBoundsLatLng(); 源代码网推荐 var width = bounds.maxX - bounds.minX; 源代码网推荐 var height = bounds.maxY - bounds.minY; 源代码网推荐 for (var i = 0; i < 10; i++) { 源代码网推荐 var point = new GPoint(bounds.minX + width * Math.random(), 源代码网推荐 bounds.minY + height * Math.random()); 源代码网推荐 var marker = createMarker(point, i); 源代码网推荐 map.addOverlay(marker); 源代码网推荐 源代码网推荐 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 在地图上使用XML和异步远程方法调用Using XML and 源代码网推荐 Asynchronous RPC("AJAX") 源代码网推荐 在这个例子中，我们下载了一个静态文件"data.xml"，这个文件包含有一系列以XML存储的经纬度坐标。当下载完成后，我们解析这个XML文件并在每个经­-纬度交汇处，创建一个图标。 源代码网推荐 源代码网推荐 // Center the map on Palo Alto 源代码网推荐 var map = new GMap(document.getElementById("map")); 源代码网推荐 map.addControl(new GSmallMapControl()); 源代码网推荐 map.addControl(new GMapTypeControl()); 源代码网推荐 map.centerAndZoom(new GPoint(-122.141944, 37.441944), 4); 源代码网推荐 // Download the data in data.xml and load it on the map. The format we 源代码网推荐 // expect is: 源代码网推荐 // <markers> 源代码网推荐 // <marker lat="37.441" lng="-122.141"/> 源代码网推荐 // <marker lat="37.322" lng="-121.213"/> 源代码网推荐 // </markers> 源代码网推荐 var request = GXmlHttp.create(); 源代码网推荐 request.open("GET", "data.xml", true); 源代码网推荐 request.onreadystatechange = function() { 源代码网推荐 if (request.readyState == 4) { 源代码网推荐 var xmlDoc = request.responseXML; 源代码网推荐 var markers = 源代码网推荐 xmlDoc.documentElement.getElementsByTagName("marker"); 源代码网推荐 for (var i = 0; i < markers.length; i++) { 源代码网推荐 var point = new 源代码网推荐 GPoint(parseFloat(markers[i].getAttribute("lng")), 源代码网推荐 源代码网推荐 源代码网推荐 parseFloat(markers[i].getAttribute("lat"))); 源代码网推荐 var marker = new GMarker(point); 源代码网推荐 map.addOverlay(marker); 源代码网推荐 } 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 request.send(null); 源代码网推荐 源代码网推荐 API 总览 源代码网推荐 GMap 类 源代码网推荐 GMap类的一个实例代表网页上的一个简单的地图。你可以为这个实例创建很多实例（这个网页上有多少地图，你就可以创建多少个）。一个地图被包含再一个容器中，­-一般来说是一个DIV元素。如果你没有明确地指出地图的尺寸，地图将会使用容器的大小来决定其大小。 源代码网推荐 源代码网推荐 源代码网推荐 GMap类提供一些方法来控制地图的空间位置（指定中心和缩放程度）和在地图上添加和移除叠加图层(overlays).它还提供了打开一个"消息窗口"的方法­-，这个"消息窗口"就是你再Google 源代码网推荐 源代码网推荐 源代码网推荐 Maps和Google 源代码网推荐 Local中所看到的。一个地图只有一个简单的消息窗口，所以在一个指定时间你只能看到一个窗口。 源代码网推荐 源代码网推荐 源代码网推荐 Event 源代码网推荐 源代码网推荐 源代码网推荐 你可以使用Event监听器往你的应用中动态地添加元素。一个对象提供了很多被命名的事件(Event),你的应用可以使用静态方法GEvent.addLis­-tener或者GEvent.bind监听这些事件。例如，下面的代码片断就在用户点击地图窗口时显示一个警告信息。 源代码网推荐 源代码网推荐 源代码网推荐 var map = new GMap(document.getElementById("map")); 源代码网推荐 GEvent.addListener(map, "click", function() { 源代码网推荐 alert("You clicked the map"); 源代码网推荐 源代码网推荐 源代码网推荐 源代码网推荐 }); 源代码网推荐 源代码网推荐 源代码网推荐 GEvent.addListener方法作为一个第三参数的函数存在，这个方法的使用需要引用一个事件处理函数在里面。如果你像要对一个方法类绑定一个事件，­-你可以使用GEvent.bind。例如： 源代码网推荐 源代码网推荐 function MyApplication() { 源代码网推荐 this.counter = 0; 源代码网推荐 this.map = new GMap(document.getElementById("map")); 源代码网推荐 GEvent.bind(this.map, "click", this, this.onMapClick); 源代码网推荐 源代码网推荐 源代码网推荐 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 MyApplication.prototype.onMapClick() { 源代码网推荐 this.counter++; 源代码网推荐 alert("You have clicked the map " + this.counter + 源代码网推荐 this.counter == 1 ?" time.":" times."); 源代码网推荐 源代码网推荐 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 var application = new MyApplication(); 源代码网推荐 源代码网推荐 消息窗口(the info window). 源代码网推荐 Map 源代码网推荐 类有一个简单的"消息窗口"，可以在地图上方的浮动窗口内显示HTML内容。 源代码网推荐 源代码网推荐 源代码网推荐 最基本的"消息窗口"方法时openInfoWindow，这个方法使用一个点和一个HTML中的Dom元素作为参数。HTML 源代码网推荐 源代码网推荐 源代码网推荐 DOM元素被添加在消息窗口容器之后，消息窗口会显示在这个点上方。 源代码网推荐 源代码网推荐 源代码网推荐 openInfoWindowHtml也很相似，但是它以一个HTML字符串作为一个参数而不是一个DOM元素。 源代码网推荐 源代码网推荐 源代码网推荐 openInfoWindowsXslt以一个XML 源代码网推荐 DOM元素以及XSLT文档的URL来产生窗口内容，如果用户的浏览器没有下载下来的话，将异步地下载XSLT。 源代码网推荐 源代码网推荐 源代码网推荐 要在一个叠置图层（例如一个标记）上显示消息窗口，你可以通过一个可选的第三参数指定消息窗口 源代码网推荐 源代码网推荐 源代码网推荐 位置和你所指定的点之间的偏移量。例如，如果你的标记有10个象素高，你可以设置该象素便宜为GSize(0,-10). 源代码网推荐 源代码网推荐 源代码网推荐 GMarker类提供openInfoWindow方法来为你处理图标的大小和形状产生的象素偏移，所以你一般不需要为计算你应用中的图标偏移而担心。 源代码网推荐 源代码网推荐 源代码网推荐 叠置图层(Overlays) 源代码网推荐 叠置图层（似乎应该翻译为叠加物更为妥当）时在地图上的和经纬度坐标绑定的对象，所以它们会随 源代码网推荐 源代码网推荐 源代码网推荐 着你拖动/缩放或者变换地图投影的时候(例如变换地图模式到卫星模式的时候)。 源代码网推荐 源代码网推荐 源代码网推荐 Maps 源代码网推荐 API提供了两种类型的叠加物，一种是标记，他们是地图上的图标，另外一种是折线，他们是通 源代码网推荐 源代码网推荐 源代码网推荐 过经纬度坐标构成的。 源代码网推荐 源代码网推荐 源代码网推荐 图标和标记 源代码网推荐 GMarker类的构造器使用一个图标和一个点参数并提供一个小系列的事件对象(如单击)等等。上面的 源代码网推荐 源代码网推荐 源代码网推荐 ovrlay.htm例子就提供了一个简单的创建标记的例子。 源代码网推荐 创建标记最难的部分是指定图标，它比较复杂，是因为在Maps 源代码网推荐 源代码网推荐 源代码网推荐 API中，有相当多的不同的图像才构成 源代码网推荐 一个简单的图标。 源代码网推荐 每个图标有（至少有）一个前景图像和一个阴影图像。阴影图像需要从前景图像的45度角方位创建， 源代码网推荐 源代码网推荐 源代码网推荐 阴影图像的左下角必须与图标前景图像的左下角绑定在一起。阴影需要是一个24位的透明性为alpha 源代码网推荐 源代码网推荐 源代码网推荐 的PNG图像，这样其边缘才能在地图上方看起来正确。 源代码网推荐 GIcon类需要在你初始化它们的时候指定这些影像的尺寸，这样Maps 源代码网推荐 源代码网推荐 源代码网推荐 API才能创建合适大小的图像元 源代码网推荐 素。这是指定一个图标所需要的最小量的代码(在这里，图标是google 源代码网推荐 源代码网推荐 源代码网推荐 maps中使用)。 源代码网推荐 var icon = new GIcon(); 源代码网推荐 icon.image = "http://www.google.com/mapfiles/marker.png"; 源代码网推荐 icon.shadow = "http://www.google.com/mapfiles/shadow50.png"; 源代码网推荐 icon.iconSize = new GSize(20, 34); 源代码网推荐 icon.shadowSize = new GSize(37, 34); 源代码网推荐 GIcon类提供了另外7个属性，你应该设定这些属性来使你的图标得到最多的浏览器兼容性和功能。例如，imageMap属性指定了图标图形中不透明的部分的形­-状。如果你没有在你的图标对象中设定这个属性，整个的图标图像（包括透明部分）将会在Firefox/Mozilla浏览器中变得可以点击的。查看GIcon­类-参考得到更多的消息。 源代码网推荐 源代码网推荐 源代码网推荐 折线(Polylines) 源代码网推荐 GPolyline类构造器使用一系列的经纬度二维数组作为参数。你可以指定线的颜色，宽度和透明度。颜色可以用老的HTML样式指定，如"#FF0000".­-GPloyline不懂得以颜色单词，如"red"命名的颜色。例如，下面的代码创建一个两点之间的10象素宽，红色的线。 源代码网推荐 源代码网推荐 源代码网推荐 var polyline = new GPolyline([new GPoint(-122.1419, 37.4419), 源代码网推荐 new GPoint(-122.1519, 37.4519)], 源代码网推荐 "#ff0000", 10); 源代码网推荐 map.addOverlay(polyline); 源代码网推荐 在IE浏览器中，我们使用VML来画多线。在其它的浏览器中，我们从google的服务器中请求线的图像 源代码网推荐 源代码网推荐 源代码网推荐 并将图像叠加在地图上，在地图被缩放和漫游时，酌情刷新地图。 源代码网推荐 源代码网推荐 源代码网推荐 控制器(Controls) 源代码网推荐 Controls使用addControl方法被添加上去.Maps 源代码网推荐 API提供了一套内嵌的控制器，你可以在地图里面使 源代码网推荐 用他们： 源代码网推荐 GLargeMapControl－一个在Google 源代码网推荐 Maps上的大的缩放/漫游工具。 源代码网推荐 GSmallMapControl－一个在Google 源代码网推荐 Local上的小一些的缩放/漫游工具 源代码网推荐 GSmallZoomControl-一个小的缩放工具，在Geegle 源代码网推荐 Maps上一个小的弹出窗口中使用它来显示一定的 源代码网推荐 方向。 源代码网推荐 GMapTypeControl－让你在不同的Map类型中进行切换（如map和satellite） 源代码网推荐 源代码网推荐 源代码网推荐 例如，要添加一个你在google 源代码网推荐 maps上看到的缩放/漫游控制器到你的地图上，你需要在你的地图初始 源代码网推荐 源代码网推荐 源代码网推荐 化时引入下面的一行代码 源代码网推荐 map.addControl(new GLargeMapControl()); 源代码网推荐 源代码网推荐 源代码网推荐 XML和RPC 源代码网推荐 Google Maps 源代码网推荐 API提供了一个工厂方法来创建XmlHttpRequest对象，这些对象在近期版本的IE， 源代码网推荐 源代码网推荐 源代码网推荐 FireFox和Safari中都能使用。例如： 源代码网推荐 var request = GXmlHttp.create(); 源代码网推荐 request.open("GET", "myfile.txt", true); 源代码网推荐 request.onreadystatechange = function() { 源代码网推荐 if (request.readyState == 4) { 源代码网推荐 alert(request.responseText); 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 源代码网推荐 } 源代码网推荐 源代码网推荐 源代码网推荐 request.send(null); 源代码网推荐 你可以使用静态方法Gxml.parse来解析一个XML文档，它只需要一个XML字符串作为唯一的参数。这个方法对所有的浏览器都兼容，如果浏览器没有本地的­-XML解析器的话，它将使用一个javascriptXML解析器作为后援。我们不能对这些后备的解析器在性能和正确性上作出任何保证。 源代码网供稿. |
