现在的位置: 首页 > 综合 > 正文

google地图

2012年03月19日 ⁄ 综合 ⁄ 共 1692字 ⁄ 字号 小 中 大 ⁄ 评论关闭
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.   <head>
  4.     <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
  5. <title>Google Maps JavaScript API Example</title>
  6. <!--导入Google Maps API库文件。注意将本代码中的API Key替换为前文申请到的API Key-->
  7. <script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAA1j86tnUDFv8OAtC8dZVtKRT8YXSkg32FmSueYimfV_yj5DJguRRW5eQHwEBk10jwkDxLKNltT_kuQA" type="text/javascript"></script>
  8. <script type="text/javascript">
  9. //<![CDATA[
  10. //注意:在Javacript代码块里嵌入CDATA段可以防止不兼容Javacript的浏览器不产生错误信息
  11. //这是一个编写网页的好习惯
  13.     var map;  //全局GMap
  15.     //网页加载时用于初始化Google地图
  16.     
  17.     function load()
  18.     {
  19.       if (GBrowserIsCompatible())  //检查浏览器兼容性
  20.                                   //如果浏览器无法满足加载Google地图的最低条件，则不进行进一步操作
  21.                                   //这是编写Google地图网页的一个值得推荐的做法
  22.       {
  23.         //创建GMap2对象
  24.         map = new GMap2(document.getElementById("map"));
  25.         
  26.         //显示地图，并设置其中心，缩放值
  27.         //缩放级别设得比较小，这样就可以看到世界地图了
  28.         map.setCenter(new GLatLng(37.4419, -122.1419), 2);
  29.       }
  30.     }
  31.     
  32.     //移动地图中心到北京
  33.     function moveMap()
  34.     {
  35.       //北京的经纬度分别为39.92, 116.46
  36.       map.panTo(new GLatLng(39.92, 116.46));
  37.     }
  38.     
  39.     //改变地图类型为混合地图
  40.     function changeMapType()
  41.     {
  42.       map.setMapType(G_HYBRID_MAP);
  43.     }
  44.     //]]>
  45.     </script>
  46.   </head>
  47.   <!--加载时调用load()函数加载地图，注意加上onunload="GUnload()"防止内存泄露-->
  48.   <body onload="load()" onunload="GUnload()">
  49.     <!--以下id为map的DIV元素即为Google地图的容器-->
  50.     <div id="map" style="width: 500px; height: 300px"></div>
  51.     <input type="button" value="移动地图中心" onclick="moveMap()" />
  52.     <input type="button" value="改变地图类型" onclick="changeMapType()" />
  53.   </body>
  54. </html>
返回
【上篇】
【下篇】

作者:

抱歉!评论已关闭.

返回首页

Copyright © 2013-2018 学步园  保留所有权利.
软文销售 QQ客服：2265327166 点击这里给我发消息（其他合作也可洽谈）
必威体育
必威电竞