谷歌地图定位.docx

谷歌地图API定位和示例服务概述Google 地图 API 会定期进行扩展以添加新的功能和特性，通常这些功能和特性会先在上发布。本部分包含了上述这些服务。注意：由于“服务”的定义在某种程度上较为模糊，因此本部分所涉及的内容也较为广泛。从根本上说，我们把无法归到其他类别下的精华内容都归到了此部分中。XML 和数据解析Google Maps API 可导出一种工厂方法，用于创建独立于浏览器的XmlHttpRequest()对象，该对象在 Internet Explorer、Firefox 和 Safari 的较新版本中均可使用。与所有的XmlHttpRequest相同，任何检索的文件都必须位于您的本地域中。下列示例会下载名为myfile.txt的文件，并在 JavaScriptalert()中显示其内容：var request = GXmlHttp.create();request.open(GET, myfile.txt, true);request.onreadystatechange = function() if (request.readyState = 4) alert(request.responseText); request.send(null);该 API 还可导出较为简单的GDownloadUrl()方法，适用于避免检查XmlHttpRequest()readyState的典型 HTTP GET 请求。可使用GDownloadUrl()对上例进行改写，具体如下：GDownloadUrl(myfile.txt, function(data, responseCode) alert(data););您可以使用静态方法GXml.parse()来解析 XML 文档，该方法采用了 XML 字符串作为其唯一参数。该方法兼容大部分热门的浏览器，但如果浏览器不支持 XML 本地解析，则会引发异常。在此示例中，我们使用GDownloadUrl方法下载一个静态文件 (data.xml)，该文件中包含一个 XML 格式的纬度/经度坐标列表。下载完成后，我们使用GXml解析该 XML 文档，并为其中的每个点创建一个标记。var map = new GMap2(document.getElementById(map_canvas);map.addControl(new GSmallMapControl();map.addControl(new GMapTypeControl();map.setCenter(new GLatLng(37.4419, -122.1419), 13);/ Download the data in data.xml and load it on the map. The format we/ expect is:/ / / / GDownloadUrl(data.xml, function(data, responseCode) var xml = GXml.parse(data); var markers = xml.documentElement.getElementsByTagName(marker); for (var i = 0; i markers.length; i+) var point = new GLatLng(parseFloat(markersi.getAttribute(lat), parseFloat(markersi.getAttribute(lng); map.addOverlay(new GMarker(point); );查看示例 (xhr-requests.html)。此示例使用外部 XML 数据文件data.xml。有关详细信息，请参见GXmlHttp和GXml类参考。地址解析地址解析是将地址（如“1600 Amphitheatre Parkway, Mountain View, CA”）转换为地理坐标（如纬度 37.423021 和经度 -122.083739）的过程，您可以根据该地理坐标放置标记或定位地图。Google Maps API 包含了“地址解析”网络服务，您可以直接通过 HTTP 请求或使用GClientGeocoder对象进行访问。Google 地图 API 提供客户端地址解析器，用于动态地对用户输入的地址进行解析。相反地，如果您希望对静态的已知地址进行地址解析，请参见地址解析服务文档。地址解析对象您可以通过GClientGeocoder对象访问 Google Maps API 地址解析服务，还可以使用GClientGeocoder.getLatLng()将字符串地址转换成GLatLng。该方法采用了待转换的字符串地址和要在检索地址时执行的回调函数作为参数。该回调函数是必需的，因为地址解析需要向 Google 的服务器发送请求，这可能需要一段时间才能完成。在此示例中，我们会对某个地址进行地址解析，并在该点上添加标记，然后打开显示该地址的信息窗口。请注意，回调函数是作为函数常量进行传递的。var map = new GMap2(document.getElementById(map_canvas);var geocoder = new GClientGeocoder();function showAddress(address) geocoder.getLatLng( address, function(point) if (!point) alert(address + not found); else map.setCenter(point, 13); var marker = new GMarker(point); map.addOverlay(marker); / As this is user-generated content, we display it as / text rather than HTML to reduce XSS vulnerabilities. marker.openInfoWindow(document.createTextNode(address); );查看示例 (geocoding-simple.html)您还可以对 Maps API 地址解析器进行修改，以便通过GClientGeocoder.setViewport()方法优先显示指定视口（表现为GLatLngBounds类型的边框）内的结果。您可以使用GClientGeocoder.setBaseCountryCode()方法返回针对特定域（国家/地区）定制的结果。对于 Google Maps 主应用程序提供地址解析服务的每个区域，您都可以向其发送地址解析请求。例如，如果您使用国家/地区代码“es”将域指定为西班牙 (http:/maps.google.es)，那么您在搜索“托莱多”时，系统返回的结果会与通过美国默认域 () 获得的结果不同。提取结构化地址如果您希望访问关于某个地址的结构化信息，则可使用GClientGeocoder提供的getLocations()方法，该方法会返回一个包含以下信息的 JSON 对象： Statuso request- 请求类型。在此情况下，它始终为geocode。o code- 响应代码（与 HTTP 状态代码类似），用于表明地址解析请求是否成功。请参见状态代码的完整列表。 Placemark- 如果地址解析器查找到多个匹配项，则会返回多个地标。o address- 格式恰当且大小写正确的地址。o AddressDetails- 使用 xAL 格式的地址，或称为可扩展地址语言 (eXtensible Address Language)（一种设置地址格式的国际标准）。o Accuracy- 表示指定地址的地址解析所能达到的精确度的属性。请参见可能值的列表。o Point- 3D 空间中的一个点。o coordinates- 该地址的经度、纬度和海拔。在此情况下，海拔始终设为 0。以下显示了地址解析器针对 Google 总部地址所返回的 JSON 对象： name: 1600 Amphitheatre Parkway, Mountain View, CA, USA, Status: code: 200, request: geocode , Placemark: address: 1600 Amphitheatre Pkwy, Mountain View, CA 94043, USA, AddressDetails: Country: CountryNameCode: US, AdministrativeArea: AdministrativeAreaName: CA, SubAdministrativeArea: SubAdministrativeAreaName: Santa Clara, Locality: LocalityName: Mountain View, Thoroughfare: ThoroughfareName: 1600 Amphitheatre Pkwy , PostalCode: PostalCodeNumber: 94043 , Accuracy: 8 , Point: coordinates: -122.083739, 37.423021, 0 在此示例中，我们使用了getLocations()方法对地址进行地址解析，从 JSON 中提取出格式恰当的地址和两个字母的国家/地区代码，并将其显示在信息窗口中。var map;var geocoder;function addAddressToMap(response) map.clearOverlays(); if (!response | response.Status.code != 200) alert( + address + not found); else place = response.Placemark0; point = new GLatLng(place.Point.coordinates1, place.Point.coordinates0); marker = new GMarker(point); map.addOverlay(marker); marker.openInfoWindowHtml(place.address + + Country code: + place.AddressDetails.Country.CountryNameCode); 查看示例 (geocoding-extraction.html)反向地址解析“地址解析”这一术语通常指将易于理解的地址转换成地图上的一个点的过程。与此相反，将地图上的点转换成易于理解的地址的这一过程则称为“反向地址解析”。GClientGeocoder.getLocations()方法同时支持标准地址解析和反向地址解析。如果您向此方法传递一个GLatLng对象（而不是String地址），则地址解析器会执行反向查找，并返回最接近的可寻址位置的结构化 JSON 对象。请注意，如果所提供的GLatLng与所有可寻址位置均未能精确匹配，那么，最接近的可寻址位置与查询的原始纬度和经度值之间可能有一段距离。注意：反向地址解析并不能做到完全精确。地址解析器会试图在一定的偏差范围内查找最接近的可寻址位置；如果找不到匹配项，则地址解析器通常会返回G_GEO_UNKNOWN_ADDRESS (602)状态代码。var map;var geocoder;var address;function initialize() map = new GMap2(document.getElementById(map_canvas); map.setCenter(new GLatLng(40.730885,-73.997383), 15); map.addControl(new GLargeMapControl); GEvent.addListener(map, click, getAddress); geocoder = new GClientGeocoder();function getAddress(overlay, latlng) if (latlng != null) address = latlng; geocoder.getLocations(latlng, showAddress); function showAddress(response) map.clearOverlays(); if (!response | response.Status.code != 200) alert(Status Code: + response.Status.code); else place = response.Placemark0; point = new GLatLng(place.Point.coordinates1,place.Point.coordinates0); marker = new GMarker(point); map.addOverlay(marker); marker.openInfoWindowHtml( orig latlng: + + + latlng: + place.Point.coordinates1 + , + place.Point.coordinates0 + + Status Code: + response.Status.code + + Status Request: + response.Status.request + + Address: + place.address + + Accuracy: + place.AddressDetails.Accuracy + + Country code: + place.AddressDetails.Country.CountryNameCode); 地址解析缓存默认情况下，GClientGeocoder会配备客户端缓存。该缓存用于存储地址解析器响应，这样，当对某个地址重复进行地址解析时，地址解析器就能更快地作出响应。要关闭缓存，您只需向GClientGeocoder对象的setCache()方法传递null即可。不过，我们建议您启用缓存功能，因为这样可以提高性能。要更改GClientGeocoder正在使用的缓存，请调用setCache()，然后传入新的缓存。要清空当前缓存中的内容，请直接在地址解析器或缓存上调用reset()方法。我们鼓励开发人员构建自己的客户端缓存。在此示例中，我们构建了一个缓存，其中包含了对六座首都（属于 geocoding API 涵盖的国家/地区）的预先计算的地址解析器响应。我们先构建了地址解析响应的数组，然后，创建了用于扩展标准 GeocodeCache 的自定义缓存。定义缓存后调用setCache()方法。系统对缓存中存储的对象不会执行严格的检查，因此您也可以在其中存储其他信息（比如人口规模）。/ Builds an array of geocode responses for the 6 capitalsvar city = name: Washington, DC, Status: code: 200, request: geocode , Placemark: address: Washington, DC, USA, population: 0.563M, AddressDetails: Country: CountryNameCode: US, AdministrativeArea: AdministrativeAreaName: DC, Locality: LocalityName: Washington , Accuracy: 4 , Point: coordinates: -77.036667, 38.895000, 0 , . / etc., and so on for other cities; var map; var geocoder; / CapitalCitiesCache is a custom cache that extends the standard GeocodeCache. / We call apply(this) to invoke the parents class constructor. function CapitalCitiesCache() GGeocodeCache.apply(this); / Assigns an instance of the parent class as a prototype of the / child class, to make sure that all methods defined on the parent / class can be directly invoked on the child class. CapitalCitiesCtotype = new GGeocodeCache(); / Override the reset method to populate the empty cache with / information from our array of geocode responses for capitals. CapitalCitiesCtotype.reset = function() GGeocodeCtotype.reset.call(this); for (var i in city) this.put(, cityi); map = new GMap2(document.getElementById(map_canvas); map.setCenter(new GLatLng(37.441944, -122.141944), 6); / Here we set the cache to use the UsCitiesCache custom cache. geocoder = new GClientGeocoder(); geocoder.setCache(new CapitalCitiesCache();查看示例 (geocoding-cache.html)使用地址解析网络服务Google 也提供直接通过 HTTP 执行的地址解析网络服务。这种地址解析服务与 JavaScript Google Maps API 不同。对于动态的地址解析请求或实时的检索地址解析请求，我们不建议使用地址解析网络服务；您可以改为使用本章中介绍的 JavaScript 客户端地址解析器。但是，如果您要填充静态数据组、需要进行调试或 JavaScriptGClientGeocoder对象不可用，则建议使用 HTTP 地址解析器。有关详情，请参见地址解析网络服务。使用 Street View 对象使用 Street View 全景图对象要求客户端浏览器支持 Flash 插件。Google Street View 提供了从指定道路遍及 Google Maps 覆盖范围的 360 度全景视图。Street View 示例图片如下所示。Google 街道视图使用 Flash 插件来显示这些交互图像，大部分浏览器都支持该插件。Google Maps API 提供了 Street View 服务，用于获取和处理 Google Maps Street View 中使用的图像。新功能！Street View 服务现可提供来自支持的图片存储区（如 Panaramio 和 Picasa）的用户照片。请参见下方的在 Street View 中显示用户照片。GStreetviewPanorama对象通过使用GStreetviewPanorama对象可支持街道视图图像，该对象提供街道视图 Flash 查看器的 API 接口。要将街道视图合并到地图 API 的应用程序中，您需要遵循以下较为简单的步骤：1. 创建一个容器（通常是元素），用于存放街道视图 Flash 查看器。2. 创建GStreetviewPanorama对象，并将其放置在容器内。3. 初始化 Street View 对象，以便引用特定的位置，并显示初始的“视点”(POV)。4. 通过检查603错误值来处理不支持的浏览器。GStreetviewPanorama对象要求其构造函数内包含一个容器元素，它还可让您使用GStreetviewPanoramaOptions参数设置其地址（可选）。您可以在构建后在该对象上调用setLocationAndPOV()，以更改其位置和 POV。注意：尽管街道视图功能专门用来与地图结合使用，但这并非强制性要求。您也可以在不使用地图的情况下单独使用街道视图对象。有关容器和设置位置及视点的详细信息，将在下文中介绍。Street View 容器Street View Flash 查看器需要一个容器 DOM 节点，以便在其中显示其内容（通常为元素）。为了实现全景图像的最佳显示结果，我们建议其最低尺寸应为 200x200 像素。我们同样不建议使用大型查看器，因为这样可能导致 Flash 查看器消耗过多内存，从而对浏览器的性能产生负面影响。GStreetviewPanorama构造函数需要一个container参数，用于识别在其中显示 Street View Flash 查看器的初始容器元素。您可以hide()GStreetviewPanorama对象，以暂时将其隐藏起来；也可以show()该对象，以重新显示查看器。如果您希望更改 Street View Flash 查看器的容器，可随时向其发送setContainer()方法，并传递它应当附加到的新元素。如果该容器的大小经过了重新调整，那么您可以向GStreetviewPanorama对象发送checkResize()方法，可强制重新调整该对象的大小，以使其适应新的尺寸。如果您希望从 DOM 中彻底删除 Street View Flash 查看器并释放其内存，请向该对象传递remove()方法。从 DOM 中删除街道视图对象的容器元素之前，请务必调用该方法，否则将导致内存泄漏和/或客户端浏览器上发生 Javascript 错误。街道视图位置Street View 图片由位置（对应于GLatLng）和特定方向 (GPov) 组成，这两项共同标识了图片显示的视图。您可以在构建 Street View 对象时，使用可选的GStreetviewPanoramaOptions参数来指定这两项参数。要了解 Street View 当前支持的城市列表，请查看Google Maps 帮助中心。要确定某个地点是否支持 Street View 数据，有三种基本方法： 对于已知有效的 Street View 位置，您可以存储其GLatLng。 您可以检查GStreetviewOverlay的图块叠加层并直接检查道路网络。支持 Street View 的道路会在叠加层上以蓝色突出显示。然后，您就可以使用点击事件或地址解析逻辑向GStreetviewPanorama对象传递支持的地点了（请参见街道视图叠加层。） 您可以使用GStreetviewClient对象，对指定了传递GLatLng的街道视图对象执行查询。GStreetviewClient对象支持使用大量查询来查找全景数据。（请参见Street View 客户查询）。请注意，最后两种方法并不精确：在这些情况下，Street View 服务不要求提供（一般也不接收）精确的纬度和经度，而是搜索指定的GLatLng“附近”是否存在全景图数据。以下示例使用了GStreetviewPanoramaOptions来指定 Street View 所使用的初始纬度和经度。POV 项已留空，表明默认视图朝向北方。var fenwayPark = new GLatLng(42.345573,-71.098326);panoramaOptions = latlng:fenwayPark ;var myPano = new GStreetviewPanorama(document.getElementById(pano), panoramaOptions);查看示例 (streetview-simple.html)街道视图错误处理由于街道视图要求支持 Flash 插件，因此，您需要编写代码来测试用户浏览器是否支持该插件。您也可以通过注册一个对GStreetviewPanorama对象上的error事件进行侦听的事件侦听器，在您的应用程序中进行这项检查。error事件将会传递一个错误代码，您可以根据其进行判断。下面的示例代码针对是否支持 Flash 插件执行快速检查，如果不支持 Flash 则显示一个警告对话框。var fenwayPark = new GLatLng(42.345573,-71.098326);panoramaOptions = latlng:fenwayPark ;myPano = new GStreetviewPanorama(document.getElementById(pano), panoramaOptions);GEvent.addListener(myPano, error, handleNoFlash); function handleNoFlash(errorCode) if (errorCode = 603) alert(Error: Flash doesnt appear to be supported by your browser); return; Street View 视点 (POV)Street View 位置定义了图片的镜头固定位置，但未定义该图片的镜头方向。为此，GPov对象常量会定义三个属性： yaw定义了镜头位置周围相对于正北的旋转角度（以度为单位）。偏航角按顺时针方向测量（90 度为正东）。 pitch定义了相对于镜头初始默认倾斜度的“向上”或“向下”的角度差异，倾斜度通常（但并不总是）水平的。（例如，从山上拍摄的图像展示的默认跨度就可能不是水平的。）仰视时测得的跨度角为负值（与默认跨度成 -90 度垂直向上正交）；俯视时测得的跨度角为正值（与默认跨度成 +90 度垂直向下正交）。 zoom定义了该视图的缩放级别（有效地限制了“视野”），0 代表最低缩放级别。Street View 的位置不同，所提供的缩放级别高低也有所不同。默认情况下，这些值均为 0，即定义了一个朝向北方且视野最宽阔的水平视图。设置全景视图如前所述，您可以在构建全景图对象时，使用GStreetviewPanoramaOptions参数同时设置其位置和GPov；fenwayPark = new GLatLng(42.345573,-71.098326);myPOV = yaw:370.64659986187695,pitch:-20;svOpts = latlng:fenwayPark, pov:myPOV;var myPano = new GStreetviewPanorama(document.getElementById(pano), svOpts);也可以在GStreetviewPanorama对象构建完毕后，使用setLocationAndPOV()方法同时设置位置和 POV。在以下示例中，我们会创建GStreetviewPanorama对象，然后将其位置和 POV 设置为特定值。var myPano = new GStreetviewPanorama(document.getElementById(pano);fenwayPark = new GLatLng(42.345573,-71.098326);myPOV = yaw:370.64659986187695,pitch:-20;myPano.setLocationAndPOV(fenwayPark, myPOV);查看示例 (streetview-object.html)使用街道视图叠加层要确定某条道路是否支持 Street View，最简单的办法是通过GStreetviewOverlay对象。只需创建该类型的叠加层，然后将其添加到地图即可；包含 Street View 数据的道路会在地图上以蓝色轮廓突出显示出来。var map = new GMap2(document.getElementById(map_canvas);map.setCenter(new GLatLng(37.4419, -122.1419), 13);svOverlay = new GStreetviewOverlay();map.addOverlay(svOverlay);查看示例 (streetview-layer.html)当您知道某个地理区域支持街道视图后，可以通过填充GStreetviewPanorama对象在有效的街道视图道路上添加可响应单击操作的逻辑。var myPano = new GStreetviewPanorama(document.getElementById(pano);var map = new GMap2(document.getElementById(map_canvas);map.setCenter(new GLatLng(42.345573,-71.098326), 14);svOverlay = new GStreetviewOverlay();map.addOverlay(svOverlay);GEvent.addListener(map,click, function(overlay,latlng) myPano.setLocationAndPOV(latlng););如果您知道某个特定位置支持街道视图，则可以保存该位置信息和 POV 并将这些信息放入对象本身。在 Street View 中显示用户照片GStreetviewPanorama对象不仅支持 Street View 图像，还可显示来自热门的照片存储区（如 Picasa 和 Panaramio）的用户照片。下方显示了包含用户照片的 Street View 示例：当导航到包含附近用户照片的位置时，Street View 会显示一个标有“用户照片”的小窗口，点击该窗口会显示一组用户照片。启用用户照片默认情况下，Street View 内的用户照片处于启用状态。要停用 Street View 内的用户照片功能，请将GStreetviewPanoramaOptions的features参数内的userPhotos设置为false。此外，您可在该选项的userPhotoOptions字段中指定您要启用的特定照片存储区。目前，我们支持以下GStreetviewUserPhotoOptions： panoramio picasa flickr如果您不指定自己感兴趣的特定存储区，则系统会启用所有的照片存储区。以下示例显示了波士顿的地图，其中同时启用了 Picasa 和 Panoramio 的用户照片：var panoOpts = features: streetView: true, userPhotos: true , userPhotoOptions: photoRepositories: panoramio, picasa ;var myPano = new GStreetviewPanorama(document.getElementById(pano), panoOpts);var boston = new GLatLng(42.345573,-71.098326);GEvent.addListener(myPano, error, handleNoFlash); var map = new GMap2(document.getElementById(map_canvas);map.setCenter(boston, 14);svOverlay = new GStreetviewOverlay();map.addOverlay(svOverlay);myPano.setLocationAndPOV(boston);。检索特定照片某些照片存储区（当前仅panoramio存储区）可让您标识特定照片。Street View 对象可让您选择特定照片并将其显示在 Street View 对象中，方法是使用GPhotoSpec对象来选择照片。GPhotoSpec由一个repository标识符，以及一个用于标识单张照片的id字段组成。以下示例展示了波士顿芬威球场的一张照片，这是 2004 年世界大赛冠军队伍“红袜队”的主场：var panoOpts = features: streetView: false, userPhotos: true , userPhotoOptions: photoRepositories: panoramio ;var myPano = new GStreetviewPanorama(document.getElementById(pano), panoOpts);var fenway = repository: panoramio, id: 8323025;GEvent.addListener(myPano, error, handleNoFlash);myPano.setUserPhoto(fenway);街道视图客户端查询从用户的角度而言，通过直接检查GStreetviewOverlay来确定道路是否支持 Street View 的方式通常不可行，或者不理想。因此，API 提供了通过编程的方式请求并检索 Street View 数据的服务。使用GStreetviewClient对象可使该服务更加便捷。执行街道视图查找GStreetviewClient对象会使用 Google 的 Street View 服务来查找全景图数据。由于该查找操作是异步进行的，因此，此类的方法需要回调函数，以便在收到数据时执行。所有指定的回调在没有返回值时会传递null，因此，您应当在自己的回调函数内检查是否存在这种情况。GStreetviewClient方法getNearestPanoramaLatLng()会通过指定的位置检索附近全景图像的GLatLng（其自身作为GLatLng进行传递）。getNearestPanorama()和getPanoramaById()都会改为检索GStreetviewData对象，它们会存储关于特定全景图对象的元数据。以下部分对这些数据进行了说明。处理客户端响应GStreetviewData对象的结构由三个属性构成：location、copyright（包含当前显示的特定图片的相关信息）和links（提供相邻全景图对象的相关信息）。以下说明了这些属性的结构：# The location property uses the GStreetviewLocation object literallocation: latlng: GLatLng, pov: yaw: String, pitch: String, zoom: String , description: String, panoId: Stringcopyright: String# The links property uses the GStreetviewLink object literallinks: yaw: String, description: String, panoId: String（有关GStreetviewLocation和GStreetviewLink对象常量的详细说明，请查看Google 地图 API 参考。）注意：请勿将GStreetviewData.location属性与window.location属性混淆。如果您尝试从该对象的location属性中提取数据，则请确保您实际收到了从 Street View 服务器返回的响应（请参见下方）；否则location属性会默认为window.location，且会发生未知行为。如果对GStreetviewClient对象的请求成功，则会向指定的回调函数传递GLatLng或GStreetviewData对象。检索 Street View 数据是异步进行的，但客户对象可能不会检索这些数据对象，因此您的代码不应依赖这些对象。您应当