<!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=GB2312"/>
<title>Google Maps JavaScript API范例1:基本范例</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAPHHzlkwM1BqBR
_nEQeIAVhQj3ceE4HUgKrBDbUpURjZ05XGTWRROLJX8OXcBIQLbTTg1TA-gzv-MGw"
type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
//这个范例创建一个地图并定位到中国的位置.
//var map = new GMap2(document.getElementById("map"));
//map.setCenter(new GLatLng(36.94,106.08),4); //设置初始地图所在位置
//参数分别为 X坐标,y坐标 俯视尺寸
//map.setMapType(G_SATELLITE_MAP);//修改地图类型
//地图类型有
//Google集成支持的3种地图类型分别为:G_NORMAL_MAP, G_SATELLITE_MAP,
// G_HYBRID_MAP,还支持自定义地图类型.
//panTo方法用来将地图变换到指定的中心点,
//如果指定点在地图上,则地图会平滑的移动到该位置,否则直接跳转到该位置.
//您能够使用addControl方法向地图添加控件.在这个例子之中,
//我们添加了系统集成的GSmallMapControl控件和GMapTypeControl控件,第一个允许用户移动和缩放地图,
//第二个允许用户在地图类型之间切换.
/*
GLargeMapControl - 大号平移和缩放控件,位置是左上角。
GSmallMapControl - 小号平移和缩放控件,位置是左上角。
GSmallZoomControl - 小号缩放控件,位置是左上角。
GScaleControl - 地图比例尺。
GOverviewMapControl - 位于屏幕右下角、可以收起来的缩略图。
*/
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(34.45221847282654,127.28515625),4);
window.setTimeout(function() {
map.panTo(new GLatLng(35.746512259918504,78.90625)); }, 5000);
//参数说明 转到的坐标 延时时长
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.addControl(new GOverviewMapControl()); //添加右下脚缩略图
map.openInfoWindow(map.getCenter(),document.createTextNode("好运北京"));
//打开气泡提示窗口
// 随机地在地图上添加 10 个标注
var bounds = map.getBounds();
var southWest = bounds.getSouthWest();
var northEast = bounds.getNorthEast();
var lngSpan = northEast.lng() - southWest.lng();
var latSpan = northEast.lat() - southWest.lat();
for (var i = 0; i < 10; i++) {
var point = new GLatLng(southWest.lat() + latSpan * Math.random(),southWest.lng() +
lngSpan * Math.random());
map.addOverlay(new GMarker(point));}// 添加一个由 5 个随机点连成的折线,
把随机点按其经度排序以避免折线相交
var points = [];
for (var i = 0; i < 5; i++) {
points.push(new GLatLng(southWest.lat() + latSpan * Math.random(),southWest.lng()
+ lngSpan * Math.random()));
}
points.sort(function(p1, p2) { return p1.lng() - p2.lng();});
map.addOverlay(new GPolyline(points));
GEvent.addListener(map, "click", function(marker, point) {
if (marker)
{ map.removeOverlay(marker);
} else
{ map.addOverlay(new GMarker(point)); }
});
}
}
//]]>
</script>
</head>
<body onload="load()" onunload="GUnload()">
<div>
<div id="map" style="width: 750px; height: 550px">
</div>
</div> </body>
</html>
再详细的使用 还在 研究中 呵呵