google Maps API（1）-优快云博客

本文链接：https://blog.youkuaiyun.com/liupeng_qwert/article/details/45556833

先看一个简单的例子，如下所示：

<!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 JavaScript API Example</title>
    <script src="http://maps.google.com/maps?

file=api&v=2&key=ABQIAAAAQB83F8eYi3GaS_Cq6_n6FBR6bSrlNvO6tmK7rrRIKeoY-X6biRS2B9VDq-

ze1weWajiMbNLzHf9uKg"
            type="text/javascript"></script>
    <script type="text/javascript">
    //<![CDATA[

    function load() {
      if (GBrowserIsCompatible()) {
        var options = {size:GSize(200,300),backgroundColor:"#FF0000",mapTypes:

[G_NORMAL_MAP,G_SATELLITE_MAP,G_PHYSICAL_MAP],draggableCursor:"crosshair",draggingCursor:"move"}

;
        var map = new GMap2(document.getElementByIdx("mymap"),options);
        map.setCenter(new GLatLng(37.4419, -122.1419), 13);
      }
    }

    //]]>
    </script>
</head>
<body οnlοad="load()" οnunlοad="GUnload()">
    <div id="mymap" style="width:500px; height:300px"></div>
</body>
</html>

例子说明：（1）使用google maps api在自己的网页中嵌入地图首先要申请一个API Key,网址为http://code.google.com/intl/zh-CN/apis/maps/signup.html，如上述代码中第一个<script> </script>中的key关键字；

（2）使用API嵌入地图核心是function load(){ }中的代码。其实最简单的方式是直接使用 var map = new GMap2(document.getElementByIdx("yourMapName"));这里需要注意的是实例化一个GMap2类后，必须要调用setCenter()方法将地图居中显示，否则地图显示不出来。当然，可能有人需要地图在初始化时就以某种方式显示，可以根据GMap2类的构造函数中的第二个参数options进行更改，options是GMapOptions类的一个实例，该类没有构造函数，可以直接实例化为对象常量，使用方法如 var options = {size:GSize(200,300)};，类似个人可以设置地图尺寸，背景，开始时显示的类型（普通地图，卫星影像等），移动地图时鼠标样式等。

（3）创建了地图实例之后，就可以指定一个页面元素(通常是div元素)来包含它。除非您明确的指定地图的尺寸，否则地图大小会取决于容器的尺寸。

#电子地图api