重要的GMaps对象与接口

1、GMap2 类（地图类）
A、构造函数：GMap2(container:Node, opts?:GMapOptions)
说明：在指定的 HTML 容器中创建新的地图，该容器通常是一个 DIV 元素。如果可选参数 opts.mapTypes 中没有给出地图类型集合，则使用默认的集合 G_DEFAULT_MAP_TYPES。如果可选参数

opts.size 中没有给出大小，则使用 container 的大小。如果给出了 opts.size，则相应地调整地图容器元素的大小。请参见 class GMapOptions。注意：需要先将地图居中，才能使用该地图。您应该

立即调用 GMap2.setCenter() 来初始化使用该构造函数创建的地图。

var map = new GMap2(document.getElementById('map_canvas'));
产生一个GMap对象，map_canvas为DOC文档元素ID。

B、setCenter(center:GLatLng, zoom?:Number, type?:GMapType)
按指定的中心设置地图视图。也可以同时设置缩放级别和地图类型。地图类型必须是地图已知的类型。请参见构造函数和方法 addMapType()。必须在构造后先调用此方法，才能设置地图的初始状态

。在调用此函数之前调用对新构造的 GMap2 对象执行的操作，这是错误的。

map.setCenter(new GLatLng(39.9, 116.3975), 13);
设置地图视图中心点。

C、addControl(control:GControl, position?:GControlPosition)
将控件添加到地图。地图上的位置由可选的 position 参数确定。如果此参数不存在，则使用由 GControl.getDefaultPosition() 方法确定的控件默认位置。一个控件实例只能向地图中添加一次。

map.addControl(new GSmallMapControl());
创建带有可在四个方向平移、放大和缩小的按钮的控件。

map.addControl(new GLargeMapControl());
创建带有可在四个方向平移、放大、缩小的按钮以及缩放滑块的控件。

map.addControl(new GSmallZoomControl());
创建带有放大和缩小按钮的控件。

map.addControl(new GScaleControl());
创建显示地图比例尺的控件。

map.addControl(new GMapTypeControl());
创建一个标准地图类型控件，通过按钮在受支持地图类型之间进行选择和切换。

D、addOverlay(overlay:GOverlay)
将叠加层添加到地图中，并触发 addoverlay 事件。

map.addOverlay(marker);
在地图上添加一个标识层。

2、GMarker 类（位置标识类）
   A、构造函数：GMarker(latlng:GLatLng, opts?:GMarkerOptions)
   GMarker 标记地图上的位置。它实现 GOverlay 接口，因此可使用 GMap2.addOverlay() 方法添加到地图中。
   按 GMarkerOptions 中指定的选项在 latlng 创建标记。默认情况下，标记是可点击的，并且有默认图标 G_DEFAULT_ICON。
   var marker = new GMarker(new GLatLng(39.9090, 116.3977));
   创建一个标识对象，通常被用在 map.addOverlay(marker); 当作参数传入。

B、openInfoWindowHtml(content:String, opts?:GInfoWindowOptions)
通过标记图标打开地图信息窗口。信息窗口的内容为 DOM 节点。只适用于 GInfoWindowOptions.maxWidth 选项。

var html = '<div style="width:80px; padding:5px 10px;">'+'北京天安门'+'</div>';
marker.openInfoWindowHtml(html);
在图片标识上显示提示信息“北京天安门”。

C、openInfoWindow(content:Node, opts?:GInfoWindowOptions)
通过标记图标打开地图信息窗口。信息窗口的内容为 DOM 节点。只适用于 GInfoWindowOptions.maxWidth 选项。

3、GLatLng 类（坐标类）
   GLatLng 是以经度和纬度表示的地理坐标点。
   A、构造函数：GLatLng(lat:Number, lng:Number, unbounded?:Boolean)
   注意纬度和经度的顺序。如果 unbounded 标记为 true，则将使用传递的数字，否则纬度会限定在 -90 度和 +90 度之间，而经度会限定在 -180 度和 +180 度之间。

var point = new GLatLng(39.9090, 116.3977);
生成一个坐标点对象。 map.addOverlay(new GMarker(point)); 通常point作为GMarker的参数对象使用。

B、lat() 返回以度数表示的纬度坐标（-90 到 +90 之间的数字）。
C、lng() 返回以度数表示的经度坐标（-180 到 +180 之间的数字）。

4、GClientGeocoder 类（地址解析器对象）
此类用于和 Google 服务器建立直接通信，以获取用户指定地址的地址解析。另外，地址解析器可维护自己的地址缓存，可以无需往返于服务器而回答重复的查询。作为常用的最佳做法，建议不要在

回路中使用 GClientGeocoder 函数。有多个地址要进行地址解析的开发人员或许应改为使用我们的 HTTP 地址解析器。
A、构造函数：GClientGeocoder(cache?:GGeocodeCache)
创建地址解析器的新实例，直接与 Google 服务器对话。可选的缓存参数允许指定已知地址的自定义客户端缓存。如果未指定缓存，则使用 GFactualGeocodeCache。

var geocoder = new GClientGeocoder();
生成一个地址解析器对象。

B、getLatLng(address:String, callback:function)
向 Google 服务器发送请求，对指定的地址进行地址解析。如果地址已成功定位，则用 GLatLng 点调用用户指定的回调函数。否则，向回调函数提供一个 null 点。如果地址不明确，则仅向回调函

数传递最匹配的点。

具体地址解析，下面例子将看到弹出中国上海市的经纬度字符串
     var geocoder = new GClientGeocoder();
     function showAddress(address) {
         geocoder.getLatLng(address,
         function(point) {
             if (!point) {
                 alert("无法解析:" + address);
             } else {
                 alert(point.toString());
                 map.setCenter(point, 13);
                 map.addControl(new GSmallMapControl());
                 var marker = new GMarker(point);
                 map.addOverlay(marker);
                 marker.openInfoWindowHtml(address);
             }
         } );
     }
     showAddress('中国上海市');

5、google.maps.Event类(GEvent类：事件类)
   此命名空间包含的函数可用于注册事件处理程序（既处理自定义事件也处理 DOM 事件）和触发自定义事件。此 API 定义的所有事件都是由 GEvent.trigger() 内部触发的自定义事件。静态方法如下

：

A、GEvent.addListener(source:Object, event:String, handler:Function) 返回值为GEventListener
为源对象的自定义事件注册事件处理程序。返回一个可用于最终注销处理程序的句柄。可使用源对象的 this 集合调用事件处理程序。

google.maps.Event.addListener(marker, "click", function(){
         marker.openInfoWindowHtml(html);
     })

   点击标识时弹出提示框。

   B、GEvent.addDomListener(source:Node, event:String, handler:Function) 返回值为GEventListener
   为源对象的 DOM 事件注册事件处理程序。源对象必须为 DOM 节点。返回一个可用于最终注销处理程序的句柄。可使用源对象的 this 集合调用事件处理程序。此函数将 DOM 方法用于当前浏览器，

来注册事件处理程序。

C、GEvent.removeListener(handle:GEventListener)
删除使用 addListener() 或 addDomListener() 安装的处理程序。

D、GEvent.clearListeners(source:Object or Node, event:String)
删除使用 addListener() 或 addDomListener() 在指定对象上为指定事件安装的所有处理程序。

6、GBrowserIsCompatible()
判断浏览器是否支持GMaps。

以下给出一段GMaps地图使用的代码，中心表示点位北京天安门

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Gmaps Test!</title>
<script type="text/javascript" src="jquery.js"></script>
<script src="http://ditu.google.cn/maps?ie=utf-8&oe=utf-8&file=api&v=2.73&key=ABQIAAAAnfs7bKE82qgb3Zc2YyS-oBT2yXp_ZAY8_ufC3CFXhHIE1NvwkxSySz_REpPq-

4WZA27OwgbtyR3VcA" type="text/javascript"></script>
<script type="text/javascript"><!--
jQuery(function() {
   if (GBrowserIsCompatible()) {
     var map = new GMap2(document.getElementById('map_canvas'));
     var marker = new GMarker(new GLatLng(39.9090, 116.3977));
     var html = '<div style="width:80px; padding:5px 10px;">'+'北京天安门'+'</div>';

map.setCenter(new GLatLng(39.9, 116.3975), 13);

     map.addControl(new GSmallMapControl());
     map.addOverlay(marker);
     marker.openInfoWindowHtml(html);
     google.maps.Event.addListener(marker, "click", function(){
         marker.openInfoWindowHtml(html);
     })
   }
});
//--></script>

</head>

<body>
<p>测试Gmaps</p>
<div id="map_canvas" style="border:1px solid #979797; background-color:#e5e3df; width:600px; height:500px; margin:2em auto;">
<div style="padding:1em; color:gray;">正在加载...</div>
</div>
</body>
</html>

使用时需要注意两点：一载入你正确的 jquery.js 库。二是把key换成你网站自己的KEY。上面的KEY为本地调试使用，必须使用 http://localhost 访问才可用。

重要的GMaps对象与接口相关推荐

Kotlin 学习笔记（八）—— Kotlin类与对象之接口
Kotlin 学习笔记(八)-- Kotlin类与对象之接口 Kotlin学习笔记系列教程 Kotlin 学习笔记(一)-- 概述.学习曲线.开发工具.参考资料 Kotlin 学习笔记(二)-- 基础 ...
TS对象类型 -- 接口(interface)
/*** 对象类型 -- 接口*/ //在面向对象的语言中,接口(interfaces)是对行为的抽象,而具体如何行动需要类(class)去实现 //在Ts中的接口是非常灵活的概念,除了对行为抽象之外 ...
ArcGIS Engine开发之旅08--和查询相关的对象和接口
ArcGIS Engine开发之旅08--和查询相关的对象和接口原文:ArcGIS Engine开发之旅08--和查询相关的对象和接口查询在GIS领域应该是一个很频繁的操作,在GIS中除了具有属性 ...
获取对象的接口信息(方法/属性/事件)(VB6代码)
要不是WS的超级绿豆提起这东西,我还不知道呢.... 真是个好玩意!!能列出一个对象的接口,包括方法,属性,事件.....微软直接做了啊. 记录一下,以后要用到时免得忘了: Option Explic ...
TypeScript实战-05-TS接口之对象类型接口
一,前言 TS新增了一个重要概念:接口,分为对象类型接口和函数类型接口二,接口示例接口可以约束对象,函数,类的结构和类型,是一种代码协作必须遵守的契约接口的定义方式: 使用interface关键 ...
对面向过程，对象，接口，切面的理解
我对面向过程,对象,接口,切面的理解 --模范青蛙 1.面向过程面向过程是最为实际的一种思考方式,就算是面向对象的方法也是含有面向过程的思想.可以说面向过程是一种基础的方法.它考虑的是实际地实现.一 ...
Objective-C 编程语言(4)) 协议---声明由别人实现的接口，由别人来实现的方法，为匿名对象声明接口
转载请标明出处:http://blog.csdn.net/zhangxingping 协议(Protocols) 协议定义了可以由任何类实现的方法.协议至少在以下三种情况下是非常有用的: ● ...
JAVA抽象类实例化对象实现接口的三种调用方法
在笔者的学习过程中抽象类实例化对象实现接口,笔者发现了三种表示方法.第一种是要实例化接口和抽象类,再用实例化的对象调用重写的的方法,这比较繁琐:第二种是直接实例化抽象类,将抽象类进行强转成对象,因为对 ...
com组件、对象、接口
1.com(component object model)组件对象模型. 特点:语言无关.可以重用应用:DirectX.OLE DB.ADO OLE是com的应用. 2. 一个com组件包括多个co ...
Postman进阶篇（十二）-在脚本中使用pm对象访问接口响应数据（pm.response.*）
在之前的文章中介绍过postman中的两个脚本--pre-request script或test script,在这两个脚本中都有使用到pm对象.(pre-request script详细介绍.Tes ...

重要的GMaps对象与接口

重要的GMaps对象与接口相关推荐

最新文章

热门文章