Google Map API

正在用Google Map API,研究一下。

加入:地图类型按钮控件、移动工具控件;

加入:本地搜索框,并自动展开;

加入:鼠标滚轮缩放方法,平滑滚动;

<!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" xmlns:v="urn:schemas-microsoft-com:vml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Google 地图 JavaScript API 示例: 简单的地图</title>
    <script src="http://ditu.google.cn/maps?file=api&amp;v=2&amp;key=ABQIAAAAlGhYpVM6su5zq-51fbnC1hSkENdeMRDZqB5-r_HkH5safdcTMBS0Nf9yw8GbzUZciinCbThKg3rqvQ&hl=zh-CN"
            type="text/javascript"></script>
    <script type="text/javascript">

    function initialize() {
      if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map_c"),{googleBarOptions:
          {showOnLoad:true}}); //搜索框自动展开,属性调用
        map.setCenter(new GLatLng(39.917, 116.397), 6);
        map.addControl(new GSmallMapControl()); //加入小平移/缩放控件
        map.addControl(new GMapTypeControl()); //加入地图切换按钮控件,控件调用
        map.enableScrollWheelZoom(); //鼠标滚轮放大缩小方法,方法调用
        map.enableContinuousZoom();  //平滑放大缩小方法
        map.enableGoogleBar(); //加个搜索框
        map.setMapType(G_HYBRID_MAP); //显示卫星地图,G_NORMAL_MAP,G_SATELLITE_MAP
      }
    }

  </script>
  </head>
  <body onload="initialize()" onunload="GUnload()">
 <div id="map_c" style="width: 500px; height: 500px"></div>
  </body>
</html> 

参考资料:

Google 地图 API 官方资料

http://code.google.com/intl/zh-CN/apis/maps/documentation/index.html

谷歌地图 API 论坛

http://groups.google.com/group/Google-Maps-API-China

www.0x61.com

飞志 / Log.write

http://logfei.blogspot.com/2008/12/api.html

演示:

路线规划 http://chinamaps.googlecode.com/svn/mapsapi/csdn08/direction.html

搜索框自动展开 http://econym.org.uk/gmap/example_baroptions3.htm

评论恒久远,一贴永流传

提交

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

帮助他人 - 快乐自己

最近发表

Search

热门文章

随机推荐

网站收藏

增值服务

Top

Powered By Z-Blog 1.8 Walle Build 100427

© 2007-2010 zfnn.com. 皖ICP备07503469号