开发学院网页设计JavaScript google map api 与jquery结合使用--控件,监听器... 阅读

google map api 与jquery结合使用--控件,监听器

 2010-09-14 13:29:45 来源:WEB开发网   
核心提示:Google Maps JavaScript API可以让您在自己的网页上使用Google地图.在使用API之前,您应该先申请一个API key,申请API key请到:http://code.google.com/apis/maps/signup.html,google map api 与jquery结合使用--控件

Google Maps JavaScript API可以让您在自己的网页上使用Google地图.在使用API之前,您应该先申请一个API key,申请API key请到:http://code.google.com/apis/maps/signup.html。这里假设你获取到的key是:ABQIAA。

关于jquery的获取不再此处累赘,网上有许多关于jquery的介绍。

接着我们就使用JQuery和Google Maps JavaScript API来结合表现一下google map的有趣的地图效果,进而达到熟悉Google Maps JavaScript API的目标。

先来个HelloChina:

(1)在html文件中编写html代码:

map.html

  <!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=utf-8"/>
  <title>Google Maps 与 JQuery结合使用</title>
  <script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAA" type="text/javascript"></script>
  <script type="text/javascript" src="jquery.js"></script>
  <script type="text/javascript" src="map.js"></script>
  </head>
  <body>
  <div id="map" style="top:100px;left:300px;width: 600px; height: 400px"></div>
  <div id="message"></div>
  </body>
  </html>

1 2 3  下一页

Tags:google map api

编辑录入:爽爽 [复制链接] [打 印]
[]
  • 好
  • 好的评价 如果觉得好,就请您
      0%(0)
  • 差
  • 差的评价 如果觉得差,就请您
      0%(0)
更多精彩
    赞助商链接

    热点阅读
      焦点图片
        最新推荐
          精彩阅读