重要的GMaps对象与接口
?1、GMap2 類（地圖類）
?? A、構(gòu)造函數(shù)：GMap2(container:Node, opts?:GMapOptions)
?? 說明：在指定的 HTML 容器中創(chuàng)建新的地圖，該容器通常是一個(gè) DIV 元素。如果可選參數(shù) opts.mapTypes 中沒有給出地圖類型集合，則使用默認(rèn)的集合 G_DEFAULT_MAP_TYPES。如果可選參數(shù)
opts.size 中沒有給出大小，則使用 container 的大小。如果給出了 opts.size，則相應(yīng)地調(diào)整地圖容器元素的大小。請(qǐng)參見 class GMapOptions。注意：需要先將地圖居中，才能使用該地圖。您應(yīng)該
立即調(diào)用 GMap2.setCenter() 來初始化使用該構(gòu)造函數(shù)創(chuàng)建的地圖。
?? var map = new GMap2(document.getElementById('map_canvas'));
?? 產(chǎn)生一個(gè)GMap對(duì)象，map_canvas為DOC文檔元素ID。
?? B、setCenter(center:GLatLng, zoom?:Number, type?:GMapType)
?? 按指定的中心設(shè)置地圖視圖。也可以同時(shí)設(shè)置縮放級(jí)別和地圖類型。地圖類型必須是地圖已知的類型。請(qǐng)參見構(gòu)造函數(shù)和方法 addMapType()。必須在構(gòu)造后先調(diào)用此方法，才能設(shè)置地圖的初始狀態(tài)
。在調(diào)用此函數(shù)之前調(diào)用對(duì)新構(gòu)造的 GMap2 對(duì)象執(zhí)行的操作，這是錯(cuò)誤的。
?? map.setCenter(new GLatLng(39.9, 116.3975), 13);
?? 設(shè)置地圖視圖中心點(diǎn)。
?? C、addControl(control:GControl, position?:GControlPosition)
?? 將控件添加到地圖。地圖上的位置由可選的 position 參數(shù)確定。如果此參數(shù)不存在，則使用由 GControl.getDefaultPosition() 方法確定的控件默認(rèn)位置。一個(gè)控件實(shí)例只能向地圖中添加一次。
?? map.addControl(new GSmallMapControl());
?? 創(chuàng)建帶有可在四個(gè)方向平移、放大和縮小的按鈕的控件。
?? map.addControl(new GLargeMapControl());
?? 創(chuàng)建帶有可在四個(gè)方向平移、放大、縮小的按鈕以及縮放滑塊的控件。
?? map.addControl(new GSmallZoomControl());
?? 創(chuàng)建帶有放大和縮小按鈕的控件。
?? map.addControl(new GScaleControl());
?? 創(chuàng)建顯示地圖比例尺的控件。
?? map.addControl(new GMapTypeControl());
?? 創(chuàng)建一個(gè)標(biāo)準(zhǔn)地圖類型控件，通過按鈕在受支持地圖類型之間進(jìn)行選擇和切換。
?? D、addOverlay(overlay:GOverlay)?
?? 將疊加層添加到地圖中，并觸發(fā) addoverlay 事件。
?? map.addOverlay(marker);
?? 在地圖上添加一個(gè)標(biāo)識(shí)層。
2、GMarker 類（位置標(biāo)識(shí)類）
?? A、構(gòu)造函數(shù)：GMarker(latlng:GLatLng, opts?:GMarkerOptions)
?? GMarker 標(biāo)記地圖上的位置。它實(shí)現(xiàn) GOverlay 接口，因此可使用 GMap2.addOverlay() 方法添加到地圖中。
?? 按 GMarkerOptions 中指定的選項(xiàng)在 latlng 創(chuàng)建標(biāo)記。默認(rèn)情況下，標(biāo)記是可點(diǎn)擊的，并且有默認(rèn)圖標(biāo) G_DEFAULT_ICON。
?? var marker = new GMarker(new GLatLng(39.9090, 116.3977));
?? 創(chuàng)建一個(gè)標(biāo)識(shí)對(duì)象，通常被用在 map.addOverlay(marker);? 當(dāng)作參數(shù)傳入。
?? B、openInfoWindowHtml(content:String, opts?:GInfoWindowOptions)
?? 通過標(biāo)記圖標(biāo)打開地圖信息窗口。信息窗口的內(nèi)容為 DOM 節(jié)點(diǎn)。只適用于 GInfoWindowOptions.maxWidth 選項(xiàng)。
?? var html = '<div style="width:80px; padding:5px 10px;">'+'北京天安門'+'</div>';
?? marker.openInfoWindowHtml(html);
?? 在圖片標(biāo)識(shí)上顯示提示信息“北京天安門”。
?? C、openInfoWindow(content:Node, opts?:GInfoWindowOptions)
?? 通過標(biāo)記圖標(biāo)打開地圖信息窗口。信息窗口的內(nèi)容為 DOM 節(jié)點(diǎn)。只適用于 GInfoWindowOptions.maxWidth 選項(xiàng)。
??
3、GLatLng 類（坐標(biāo)類）
?? GLatLng 是以經(jīng)度和緯度表示的地理坐標(biāo)點(diǎn)。
?? A、構(gòu)造函數(shù)：GLatLng(lat:Number, lng:Number, unbounded?:Boolean)
?? 注意緯度和經(jīng)度的順序。如果 unbounded 標(biāo)記為 true，則將使用傳遞的數(shù)字，否則緯度會(huì)限定在 -90 度和 +90 度之間，而經(jīng)度會(huì)限定在 -180 度和 +180 度之間。
?? var point = new GLatLng(39.9090, 116.3977);
?? 生成一個(gè)坐標(biāo)點(diǎn)對(duì)象。 map.addOverlay(new GMarker(point));? 通常point作為GMarker的參數(shù)對(duì)象使用。
?? B、lat() 返回以度數(shù)表示的緯度坐標(biāo)（-90 到 +90 之間的數(shù)字）。
?? C、lng() 返回以度數(shù)表示的經(jīng)度坐標(biāo)（-180 到 +180 之間的數(shù)字）。
?
4、GClientGeocoder 類（地址解析器對(duì)象）
?? 此類用于和 Google 服務(wù)器建立直接通信，以獲取用戶指定地址的地址解析。另外，地址解析器可維護(hù)自己的地址緩存，可以無需往返于服務(wù)器而回答重復(fù)的查詢。作為常用的最佳做法，建議不要在
回路中使用 GClientGeocoder 函數(shù)。有多個(gè)地址要進(jìn)行地址解析的開發(fā)人員或許應(yīng)改為使用我們的 HTTP 地址解析器。
?? A、構(gòu)造函數(shù)：GClientGeocoder(cache?:GGeocodeCache)
?? 創(chuàng)建地址解析器的新實(shí)例，直接與 Google 服務(wù)器對(duì)話。可選的緩存參數(shù)允許指定已知地址的自定義客戶端緩存。如果未指定緩存，則使用 GFactualGeocodeCache。
?? var geocoder = new GClientGeocoder();
?? 生成一個(gè)地址解析器對(duì)象。
?? B、getLatLng(address:String, callback:function)
?? 向 Google 服務(wù)器發(fā)送請(qǐng)求，對(duì)指定的地址進(jìn)行地址解析。如果地址已成功定位，則用 GLatLng 點(diǎn)調(diào)用用戶指定的回調(diào)函數(shù)。否則，向回調(diào)函數(shù)提供一個(gè) null 點(diǎn)。如果地址不明確，則僅向回調(diào)函
數(shù)傳遞最匹配的點(diǎn)。
?? 具體地址解析，下面例子將看到彈出中國(guó)上海市的經(jīng)緯度字符串
???? 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('中國(guó)上海市');
???
5、google.maps.Event類(GEvent類：事件類)
?? 此命名空間包含的函數(shù)可用于注冊(cè)事件處理程序（既處理自定義事件也處理 DOM 事件）和觸發(fā)自定義事件。此 API 定義的所有事件都是由 GEvent.trigger() 內(nèi)部觸發(fā)的自定義事件。靜態(tài)方法如下
：
?? A、GEvent.addListener(source:Object, event:String, handler:Function) 返回值為GEventListener
?? 為源對(duì)象的自定義事件注冊(cè)事件處理程序。返回一個(gè)可用于最終注銷處理程序的句柄。可使用源對(duì)象的 this 集合調(diào)用事件處理程序。
??
?? google.maps.Event.addListener(marker, "click", function(){
???????? marker.openInfoWindowHtml(html);
???? })
??
?? 點(diǎn)擊標(biāo)識(shí)時(shí)彈出提示框。
???
?? B、GEvent.addDomListener(source:Node, event:String, handler:Function)? 返回值為GEventListener
?? 為源對(duì)象的 DOM 事件注冊(cè)事件處理程序。源對(duì)象必須為 DOM 節(jié)點(diǎn)。返回一個(gè)可用于最終注銷處理程序的句柄。可使用源對(duì)象的 this 集合調(diào)用事件處理程序。此函數(shù)將 DOM 方法用于當(dāng)前瀏覽器，
來注冊(cè)事件處理程序。
?? C、GEvent.removeListener(handle:GEventListener)
?? 刪除使用 addListener() 或 addDomListener() 安裝的處理程序。
?? D、GEvent.clearListeners(source:Object or Node, event:String)
?? 刪除使用 addListener() 或 addDomListener() 在指定對(duì)象上為指定事件安裝的所有處理程序。
6、GBrowserIsCompatible()
?? 判斷瀏覽器是否支持GMaps。
??
以下給出一段GMaps地圖使用的代碼，中心表示點(diǎn)位北京天安門
?
<!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>測(cè)試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>
使用時(shí)需要注意兩點(diǎn)： 一載入你正確的? jquery.js 庫(kù)。 二是把key換成你網(wǎng)站自己的KEY。? 上面的KEY為本地調(diào)試使用，必須使用 http://localhost?訪問才可用。
總結(jié)
以上是生活随笔為你收集整理的重要的GMaps对象与接口的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 北航2022软件工程第一次作业——阅读、
- 下一篇： ar9331下串口使用总结