Google Map API 开发基础--01
本章内容将针对如何使用Google Maps API中各个接口进行详细阐述，将采用实例加详解的方式，介绍Google Maps每个类的实际用途和一些WebGIS的开发技巧。在阅读完本章之后，我们希望开发者能够掌握Google Maps的开发，并且对于WebGIS也有一定的了解。
本章主要包括以下内容：
l Google Maps开发前的知识准备。
l 对于Google Maps API每个接口用法的详细描述。
l 针对Google Maps API每个接口的方法、属性的例子代码和图片。
本章代码均在IIS上测试过，部分代码不但在IIS上测试过，还在Tomcat上测试过。
4.1 概述
Google Maps作为Google Earth的后续产品，虽然和Google Earth有着本质上的不同，但是在Google的产品链上却分担着Google“三维空间搜索”相辅相成的角色。目前针对Google Maps的二次开发应用正处于蓬勃发展的阶段，国内外都出现了不少这方面的应用。
比如，有的玩家将Google Maps作为底图，把气象卫星云图覆盖在地图上，再加入降水、气压、气温、风向等参数，推出了一个气象预报网；再如很多网友喜欢把Google Maps超链接加入到自己的Blog网页上面，一来看上去比较酷，二来可以很方便地定位自己所处城市的位置，甚至将Blog上故事的发生地也标明在地图上，起到一个“地标”的作用；有的网友甚至把地区搜索等实用功能也加到Blog页面上，以增加其实用性，或者像很多车友会将自己的旅行路线通过便携式（或车载）GPS记录下来，然后通过处理，制作成KML文件，发布到自建的车友论坛上，其他车友可以通过论坛上的超链接，直接在浏览器的Google Maps地图上观看，非常生动；有的专家甚至在Google Maps上追踪生物的迁徙……
那么到底Google Maps的开发是个怎样有趣的过程呢，下面就将为读者讲解Google Maps API。
首先展示一个Google Maps的最普通的例子——“Hello world~”，几乎所有开发类书籍开头的例子总是“Hello world”，本书也不例外。在这个例子的地图中心位置放置了一个地标，当鼠标在地标上划过的时候，地标会自动弹出一个提示气球框，提示框中的内容正是“Hello world”。
HTML+JavaScript的代码如下：
<!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 JavaScript API</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=abcdefgh"
type="text/javascript"></script>
<script type="text/javascript" src="main.js">
<script type="text/javascript">
var map;
function setupMap()
{
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map1"));
map.addControl(new GLargeMapControl());
map.setCenter(new GLatLng(31.7,131.2), 10);
}
var markobj = new GMarker(new GLatLng(31.7,131.2),{draggable: true});
GEvent.addListener(markobj, "mouseover", function() {
markobj.openInfoWindowHtml("Hello world~ ");
});
map.addOverlay(markobj);
}
</script>
</head>
<body onload="javascript:setupMap();" >
<div id="map1" style="width: 300px; height: 200px"></div>
</body>
</html>
以上代码中，Google Maps API的Key为改动后的伪代码为示意之用，请读者自行申请。
代码执行后的结果如图4-1所示。
图4-1 Hello World
Google Maps的开发很多都基于地标，而对于地图显示的缩放和移动等功能，都是由其自身携带的控件完成的。基于这些功能，Google Maps的开发并非那么困难。
浙公网安备 33010602011771号