登 录
第一步：<br /> 去http://www.google.com/apis/maps/signup.html 申请一个KeyID</p> <p> 第二步：<br /> 在HTML的<title></title>之间加上对MapAPI函数库的引用，<br /> <mce:script. src="http://maps.google.com/maps?file=api&v=2&key= </p> <p>YourKeyID" type="text/javascript"></mce:script></p> <p> 第三步：<br /> 在HTML的<body></body>之间的任意位置加上一个名为map的DIV，<br /> <div id="map" style="width: 700px; height: 560px" </p> <p>align="center"></div></p> <p> 第四步：<br /> 在名为map的DIV后面，加上GMap类的实例，<br /> <mce:script. type="text/javascript"><!--</p> <p> //建立 GMap类的实例<br /> var map = new GMap(document.getElementById("map"));<br /> //添加一个控制条<br /> map.addControl(new GSmallMapControl());<br /> //配置显示模式为卫星影像<br /> map.setMapType(G_SATELLITE_TYPE);<br /> //配置中心点经纬度（上海）和缩放系数，并显示<br /> map.centerAndZoom(new GPoint(121.4838, 31.2517), 4);<br /> // --></mce:script></p> <p> 第五步：<br /> 随机添加 10个标记点，<br /> var bounds = map.getBoundsLatLng();<br /> var width = bounds.maxX - bounds.minX;<br /> var height = bounds.maxY - bounds.minY;<br /> for (var i = 0; i < 10; i++) {<br /> var point = new GPoint(bounds.minX + width * Math.random(),<br /> bounds.minY + height * Math.random());<br /> var marker = createMarker(point, i + 1);<br /> //添加标记点<br /> map.addOverlay(marker);<br /> }</p> <p> 第六步：<br /> 添加事件响应，<br /> function createMarker(point, number)<br /> {<br /> var marker = new GMarker(point);</p> <p> // Show this marker's index in the info window when it is </p> <p>clicked.<br /> var html = "Marker #<b>" + number + "</b>";<br /> GEvent.addListener(marker, 'click', function() {<br /> marker.openInfoWindowHtml(html);});</p> <p> return marker;<br /> }</p> <p>
抱歉!评论已关闭.