1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <title></title>
5 <!--在这里获取密钥http://code.google.com/intl/zh-CN/apis/maps/signup.html-->
6 <script src="http://ditu.google.cn/maps?file=api&v=2&key=ABQIAAAA5VR6aCXTjlZP10JVAJ9rAxQ6_rYj0UWRCHN5S6YkT-iCqMGq3RSC1hnQx15MPTMTVl-vhol8GMy6BQ"
7 type="text/javascript"></script>
8
9 <script type="text/javascript">
10 function initialize() {
11 if (GBrowserIsCompatible()) {
12 var map = new GMap2(document.getElementById("map_canvas"));
13 /*
14 给地图添加控件
15 GLargeMapControl - 一个在 Google 地图上使用的大平移/缩放控件
16 GSmallMapControl - 一个在 Google 地图上使用的小一点的平移/缩放控件。
17 GOverviewMapControl - 位于屏幕一角的可折叠概览地图。（推荐使用）
18 GMapTypeControl - 让用户切换地图类型（例如“地图”和“卫星”）的按钮
19 */
20 //map.addControl(new GLargeMapControl());
21 map.addControl(new GSmallMapControl());
22 map.addControl(new GMapTypeControl());
23 map.addControl(new GOverviewMapControl());
24 map.addControl(new GSmallZoomControl());
25 /*
26 自定义绘制折线
27 <<<<<
28 */
29 var polyline = new GPolyline([
30 new GLatLng(39.9493, 116.3975),
31 new GLatLng(39.9593, 116.4071)
32 ], "#ff0000", 10);
33 map.addOverlay(polyline);
34 var center = new GLatLng(39.917, 116.397);
35 var marker = new GMarker(center, { draggable: true });
36 GEvent.addListener(marker, "dragend", function() {
37 marker.openInfoWindowHtml("正在反弹...");
38 });
39 var blueIcon = new GIcon(G_DEFAULT_ICON);
40 blueIcon.image = "http://www.google.cn/intl/en_us/mapfiles/ms/micons/blue-dot.png";
41 markerOptions = { icon: blueIcon };
42 map.setCenter(new GLatLng(40.20745910697569, 116.23414993286133), 13);
43 //map.setMapType(G_SATELLITE_MAP);
44 // 在随机位置向地图中添加 10 个标记
45 // var bounds = map.getBounds();
46 // var southWest = bounds.getSouthWest();
47 // var northEast = bounds.getNorthEast();
48 // var lngSpan = northEast.lng() - southWest.lng();
49 // var latSpan = northEast.lat() - southWest.lat();
50 //设置标记的位置
51 var point = new GLatLng(40.20745910697569, 116.23414993286133);
52 //openInfoWindow方法弹出信息窗口
53 map.openInfoWindow(map.getCenter(), document.createTextNode("游一路欢迎您"));
54 /*
55 addOverlay方法添加标记位置
56 toString 方法显示添加标记位置
57 GEvent.addListener(添加时间函数)
58 */
59 //map.addOverlay(new GMarker(point));(不添加自定义组件的时候应该后面参数为空)
60 map.addOverlay(new GMarker(point));
61 GEvent.addListener(map, "click", function() {
62 var center = map.getCenter();
63 document.getElementById("message").innerHTML = center.toString();
64 });
65 //panTo移动初始化位置
66 //setTimeout(function() {map.panTo(new GLatLng(39.927, 116.407)); }, 8000);
67 }
68
69 }
70 //如果地图失效了请联系我啊
71 </script>
72
73 </head>
74 <body onload="initialize()" onunload="GUnload()">
75 <div id="map_canvas" style="width: 500px; height: 300px">
76 </div>
77 <div id="message">
78 </div>
79 <div id="enlarge">
80 </div>
81 <div id="reduce">
82 </div>
83 </body>
84 </html>
