怎么使用Google 地图 API？-优快云博客

本文介绍如何使用Google地图API将地图嵌入到网页中，并通过JavaScript实现地图的基本操作，包括设置中心点、添加控制按钮和响应点击事件以放置标记。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

教程http://www.codechina.org/doc/google/gmapapi/
地址http://code.google.com/intl/zh-CN/apis/maps/
教程http://www.codechina.org/doc/google/gmapapi/
什么是 Google 地图 API？
Google 地图 API 使您能够使用 JavaScript 将 Google 地图嵌入自己的网页中。API 提供了大量实用工具用以处理地图（正如 http://maps.google.com 网页上的地图），并通过各种服务向地图添加内容，从而使您能够在您的网站上创建功能强大的地图应用程序。
新增！ Google Maps API for Flash® - 在 Adobe® Flash 环境中构建和部署地图应用程序！
Sign up for a Google Maps API key, or read more about the API.
Map data ©2009 Tele Atlas - Terms of Use
地图 API 是一项免费的测试版服务，在客户可免费访问的任何网站上均可使用。有关更多信息，请参阅使用条款。

学习这个API最简单的方法就是看一个简单的例子。下面的网页显示一个500x300的地图，中心位于California，Palo Alto：

<!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 Maps JavaScript API Example</title>
<script src="http://maps.google.com/maps?file=api&;v=2&key=abcdefg"
type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[

function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
}
}

//]]>
</script>
</head>
<body onload="load()" onunload="GUnload()">
<div id="map" style="width: 500px; height: 300px"></div>
</body>
</html>

:arrow: :arrow: :arrow: :arrow: :arrow:
在自己的电脑上也可以看到，你只要把你做的PHP页面放到IIS或者APACHE上就可以了

你说的那些功能我贴点我做的代码给你吧
首先是JS代码

google.setOnLoadCallback(initialize);
var map;

function initialize() {
// 检查浏览器是否能使用GOOGLE地图
if ( GBrowserIsCompatible() ) {
map = new google.maps.Map2(document.getElementById('map'));
// 中心点
map.setCenter(new GLatLng(22.5354996, 113.9300036), 13);
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.addControl(new GOverviewMapControl());

////////////////////////////增加标记/////////////////////////////////
GEvent.addListener(map, "click", function(overlay,latlng)
{
map.clearOverlays();//清除原有标记
map.addOverlay(new GMarker(latlng));//增加一个标记
});

} // if
else {
alert('您的浏览器Google Map');
} // else
}

然后是页面的HTML代码

<body onload="initialize()" onunload="GUnload()">
<div id="map" ></div>
</body>

这样就可以加入地图拉