Google Earth API service manual

Google Earth API

开发者指南

制作： Google Earth 博客

版权申明 : 本手册的中文原版版权为 Google(TM) 公司所有

转载请采用《知识共享署名 - 非商业性使用 - 相同方式共享 2.5 中国大陆许可协议》

欢迎使用 Google Earth API 开发者文档。通过使用 Google Earth 插件及其 API 可以在网页中嵌入全功能的 Google Earth 及其三维视图功能。您可以像在二维的 Google Maps 上一样，在三维版本上绘制标记和线条。

由于是全新的 API ，所以可能会存在缺陷，文档也不尽完美。与 Google 一起努力使其日臻完善吧！

第

第 1

1 、目标读者

本文档专门针对熟悉 JavaScript 编程和面向对象的程序设计概念的人员而设计。 Google 地球 API 是以多种 KML 元素为基础，如果您对 KML 不熟悉，请参阅 Google 地球 KML 文档。

2 、 Google Earth API 简介

章：简单介绍

1 章：简单介绍

章：简单介绍

，

您

您可以单独使用 Google Earth API ，也可以将其同 Google Maps API 结合使用。如

果您的网页中嵌入了 Google Maps ，您可以让用户选择在 Google Maps 中还是在 Google

Earth 浏览器中查看内容来以对网页进行增效。您可以在同一网页上执行该操作。例如， Google Maps 网页以二维展示信息。集成 Google Earth 插件后，用户可以选择以三维模式显示信息，而且还可以观看到地形、几何图案及其他众多的 Google Earth 独有的功能。

3 、关于本文档中的示例

本文档中的大多数示例仅显示了相关的 JavaScript 代码，并未显示完整的 HTML 文件。您可以将 JavaScript 代码植入自己的 HTML 框架文件，也可以点击每个示例后面的链接，下载完整的 HTML 基点。

4 、安装 Google Earth 插件

使用了 Google Earth API 开发的网站需要采用安装了 Google Earth 插件的网页浏览器才可以浏览，在安装 Google Earth 插件之前，请阅读以下编程注释，以确保您的应用程序能够跨平台工作。

文件。

Google Earth 插件自带的 Sample.html 文件也可作为开始的

本版本的 Google Earth 插件仅支持 Microsoft Windows XP 和 Vista 及 Mac OS

操作系统。对其他操作系统的支持计划在未来版本中实现。

Google Earth 插件当前支持的网页浏览器有：

<html>

<head>

<title>Google</title>

<!-- *** 使用您自己的 API 密钥替换下面的密钥

（要获取密钥，请访问 http://code.google.com/apis/maps/signup.html ） *** -->

• IE 6.0+

• IE 7.0+

Firefox 2.x 或 2.0x 或 Firefox 3.0

•

• Netscape 7.1+

• Mozilla 1.4+

• Flock 1.0+

Google Chrome

•

要安装 Google Earth 插件，请： 1 、注册并获取 Google Earth API 密钥。 2 、下载并运行 Google Earth 插件安装程序。 3 、默认情况下，插件及相关文件会安装在 C:\Program Files\Google Earth Plugin 目

录。

5 、卸载 Google Earth 插件

要卸载 Google Earth 插件，请从开始菜单选择 "Google Earth Plugin"

，然后选

"Uninsall Google Earth Plugin" 。

6 、使用 Samples.html

Samples.html 文件 (http://www.google.com/earth/plugins/examples/samples/index.html) 包含很多有用的 JavaScript 示例。您可以看到 JavaScript 代码，并可从网页上直接运行这些代码。在页面上可以立即看到 Google Earth 3D 视图的变化。也可以使用该页面来测试您的 JavaScript 代码。

7 、在网页中嵌入 Google Earth

Google Earth 插件中包含了若干示例文件以及入门使用的模板。以下示例显示了用于在网页中嵌入 Google Earth 3D 视图的 HTML 和 JavaScript 。您可以根据以下示例创建自己的应用程序。

择

src="http://maps.google.com/maps?file=api&v=2&key=abcdefg"></script>

google.load("earth", "1");

google.load("maps", "2.99"); // 用于 JS 地理编码器

var ge = null;

var geocoder;

function el(e) { return document.getElementById(e); }

function init() {

geocoder = new GClientGeocoder();

google.earth.createInstance("map3d", initCB, failureCB);

}

function initCB(object) {

ge = object;

ge.getWindow().setVisibility(true);

}

function failureCB(object) {

alert(' 未能加载 ');

}

function submitLocation() {

var address = el('address').value;

geocoder.getLatLng(

address,

function(point) {

if (point && ge != null) {

var la = ge.createLookAt('');

la.set(point.y, point.x, 100, ge.ALTITUDE_RELATIVE_TO_GROUND,

0, 0, 4000);

ge.getView().setAbstractView(la);

}

);

}

</script>

</head>

8 、故障排除

<center>Google 机密 </center>

</div>

<div>

</form>

</div>

</div>

</body>

</html>

如果您的代码不能正常工作，可尝试通过以下方法解决问题：

• 确认 API 密钥是否有效。

检查有无拼写错误。注意， JavaScript 区分大小写。

•

• 使用 JavaScript 调试工具。在 Firefox 中，您可以使用 JavaScript 控制台、

Venkman Debugger 或 Firebug 插件。在 IE 中，您可以使用 Microsoft Script Debugge r 。搜索开发者论坛。如果未找到能够回答您问题的帖子，请将您的问题张贴到论坛并

•

附上问题演示网页的链接。

9 、更多资源

如果您需要了解更多关于 Google Earth 、 KML 或者 Google Maps 的信息，请参考：

• http://code.google.com/apis/kml

• http://code.google.com/apis/maps

• http://earth.google.com

第

<html>

<head>

<title> 你好 Google 地球！ </title>

google.load("earth", "1");

var ge = null;

function init() {

google.earth.createInstance("map3d", initCallback, failureCallback);

}

function initCallback(object) {

ge = object;

ge.getWindow().setVisibility(true);

}

function failureCallback(object) {

}

</script>

</head>

<div>

你好，地球！

</div>

<div id='map3d_container'

style='border: 1px solid silver; height: 600px; width: 800px;'>

第

第 2

1 、示例： “ 你好，地球 ”

要想了解 Google Earth API ，最简单方法莫过于观看简单的示例。下面的 JavaScript 代码会创建包含 Google Earth 3D 视图的网页，当运行后，您可以尝试使用操作 Google Earth 的方法操作网页中的视图，看效果是否一样：

章：基础主题

2 章：基础主题

章：基础主题

您可以在线查看本示例，也可以下载、编辑和运行该示例，但您必须将文件中的密钥

</div>

</center>

</body>

</html>

<div id='map3d_container'

style='border: 1px solid silver; height: 600px; width: 800px;'> <div id='map3d' style='height: 100%;'></div>

替换为您自己的地图 API

密钥。

（如果您为某个特定的目录注册了密钥，则该密钥同样可用于所有子目录）即使是最简单的示例，您也需要完成以下四步方能在网页中加载 Googl e Earth 插件：

1 、使用 script 标签包含 Google Earth API 的 JavaScript 。 2 、创建 div 元素包含 Google Earth 。 3 、从 body 标签的 onLoad 事件初始化对象。 4 、编写 JavaScript 函数创建 “ Google Earth ” 对象。

这些步骤详解如下：

1 、加载 Google Earth API 的 JavaScript 文件

http://www.google.com/jsapi?key=ABCDEF URL 指向 JavaScript 文件位置，该文件

包含使用 Google Earth API 所需的所有符号和定义。您的网页中必须包含一个指向该 UR L 的脚本标签（使用注册 API 时获取的密钥）。在此例中，密钥为 “ ABCDEF ” 。

2 、创建 div 元素包含 Google Earth

要在网页上显示 Google Earth ，必须为其预留一定的空间。具体是创建一个名为 div 的元素，并在浏览器的文档对象模型 (DOM) 中获取对该元素的引用。以上示例中定义了名为 “ map_3d_container ” 的 div 元素并使用 style 属性定义了其大小。

3 、从 body 标签的 onLoad 事件初始化对象

当 HTML 网页呈现时，文档对象模型 (DOM) 就会建置好，而外部图像和脚本也会接收并合并到 document 对象中。为保证地图只在页面完全加载后才置于页面上，我们仅在 HT ML 页的 <body> 元素接收到 onload 事件时才执行构建 ge 对象的函数。这样就可以避免意外的浏览器行为，并且能够更好地控制地图绘制的时间和方式。

4 、编写 JavaScript 函数创建 “ Google Earth ” 对象

var placemark = ge.createPlacemark('');

placemark.setName(" 您正身处 Google");

ge.getFeatures().appendChild(placemark);

// 为地标创建样式映射

var normal = ge.createIcon('');

normal.setHref('http://maps.google.com/mapfiles/kml/paddle/red-circle.png');

var iconNormal = ge.createStyle('');

iconNormal.getIconStyle().setIcon(normal);

var highlight = ge.createIcon('');

highlight.setHref('http://maps.google.com/mapfiles/kml/paddle/red-circle.png');

var iconHighlight = ge.createStyle('');

iconHighlight.getIconStyle().setIcon(highlight);

var styleMap = ge.createStyleMap('');

styleMap.setNormalStyle(iconNormal);

styleMap.setHighlightStyle(iconHighlight);

placemark.setStyleSelector(styleMap);

// 创建点

var la = ge.getView().copyAsLookAt(ge.ALTITUDE_RELATIVE_TO_GROUND);

var point = ge.createPoint('');

point.setLatitude(la.getLatitude());

point.setLongitude(la.getLongitude());

placemark.setGeometry(point);

4.1 、创建地标

在 Google Earth 中，经常会用到地标这一方便使用的功能。它会使用图钉作为图标，在地球表面标记出位置。通常，地标所标记的是用户正在查看的位置。您可以更改地标的名称，使用自定义的图标，还可以为地标添加其他几何属性。

以下示例创建了一个地标，标出 Google 园区在地球表面上的位置：

地标在 Google Earth 中显示为：

+ 16 hidden pages