Google Map開發(fā)整理Google Maps API 是 Google 自己推出編程 API ，可以讓全世界對 Google Maps 有興趣的程序設(shè)計師自行開發(fā)基于 Google Maps 的

Google Map開發(fā)整理

Google Maps API 是 Google 自己推出編程 API ，可以讓全世界對 Google Maps 有興趣的程序設(shè)計師自行開發(fā)基于 Google Maps 的服務，建立自己的地圖網(wǎng)站。以下是我在 Google Maps API 開發(fā)過程中找到的一些 API 的編程資源，包括中文文檔，中文說明，示例等等，希望對 Google Maps 編程感興趣的程序員有所幫助。

　　中文資料部分 （包括中文的文檔說明等，以下的網(wǎng)址都是中文內(nèi)容。）　　下面的關(guān)于 API 的中文文檔

　　 Google Maps API 第 2 版中文文

檔 　　 Google Maps API 第 2 版升級指

南 　　 Google Maps API 第 2 版類參考 　　另外一個版本的 Google Maps API 2 中文文

檔 　　 Google Maps API 第 1 版中文文

檔 　　下面是關(guān)于 KML 文件的中文文檔

　　 Google Earth KML 中文說明（一） 　　 Google Earth KML 中文說明（二） 　　 Google Earth KML 中文說明（基于 Google Earth 客戶端版本 3.0 的 KML 版本 2.0 ） 　　英文資料部分 （主要是 Google 官方的文檔說明，如果覺得中文翻譯的有問題，也可以看看這些原始內(nèi)容。 )

　　 Google Maps API 官方網(wǎng) 　　 Google Maps API 英文文檔 　　 Google Maps API 官方 Blog

　　 Google Maps API 論壇 　　 Google KML 的官方文檔 　　 Google API 官方網(wǎng) 附： Google Map API 中文開發(fā)教程

Google Map API 中文開發(fā)教程最好的教程還是 google 官方的說明文檔，而且配有詳細的例子，供大家學習，下面是文檔的英文原文連接

目錄包括

1.

2. 1. 2. 3. 4. 5. 6. 7. 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 1. 3. 1.

2.

1.

2. 1. 1. 2. 3. 4. 5. 6. 7. 3. 4.

同步中文文檔請參閱： 谷歌地圖API 密鑰（API Key）的解讀和使用技巧 好了，通過前一篇的介紹，大家對Google Map都有所瞭解了吧。不過還得一步步的來。先瞭解API Key 吧。所謂 API 密鑰（ API Key ），其實就是一個字符串，在使用 script 標簽導入 API 類庫的時候作為請求參數(shù)傳給谷歌的地圖服務器，形式就是：

我的API Key是：

ABQIAAAAMWyR7XvYN8KE9N6m_jcU4BRlfWJrPzRGiYSzS4l55_z1ea3VShRolPwARGHvivnEFRLVGXyIlsrYpA

使用谷歌地圖 API 的第一步就是要 API 密鑰， API 使用條款對這個密鑰的用途有很正式的說明，其實總結(jié)起來也很簡單：

1 、谷歌地圖 API 提供的服務是免費的，對于通過 API 正常使用谷歌地圖的網(wǎng)站基本沒有任何限制；

2 、說 “ 基本 ” 沒有限制的原因是，谷歌對每個 API 密鑰對應的網(wǎng)站所作的 請求次數(shù)有限制，每天（ 24 小時）的請求次數(shù)不能超過 15000 次；

3 、不能使用谷歌地圖從事任何非法的行為，否則谷歌應該能夠通過這個密鑰阻止你的網(wǎng)站使用谷歌地圖；

更簡單的說，谷歌使用這個密鑰保證能夠?qū)λ?API 用戶 / 網(wǎng)站進行區(qū)分，方便必要的時候?qū)?“超常規(guī) ” 用戶進行阻攔。

對于地址解析的次數(shù)限制，一般來說不會有什么影響，這里主要說 API 密鑰，所以以后有時間可以再詳細說說地址解析相關(guān)的東東。

對于 API 密鑰，還有幾點需要記下來：

1 、如果使用 API 的頁面還沒有發(fā)布，只是在本地調(diào)試，可以不用密鑰，隨便用個字符串代替就可以了；

2 、 API 密鑰只對網(wǎng)站目錄或者域有效，所以，雖然你是使用同一個谷歌帳號登錄后注冊的密鑰，但是，對不同域的網(wǎng)頁，需要用這些域分別注冊不同的密鑰，對于同一個域里的頁面，直接拿你網(wǎng)站的域名注冊一個，在這個域里的所有頁面就可以通用這個密鑰了。

還有一個關(guān)于 API 密鑰的實際問題：

在論壇里還有人問過，同一個頁面需要支持不同的域名，最簡單的就是公司有一個 cn 域名，也有一個 com 域名，這怎么辦？

其實，對于這種問題，可以提前先注冊好不同域名對應的密鑰，存在你的JS 變量里面，頁面加載時通過window.location 得到當前請求頁面的域名，通過這個域名在找到對應的密鑰，然后使用script 動態(tài)加載的方法加載地圖API ，用代碼描述就是：

// 事先已經(jīng)注冊好的密鑰

var keyMapping = {host1:key1, host2:key2};

// 實際請求頁面的域名

var requestHost = window.location.hostname;

// 找到需要的密鑰

var key = keyMapping[requestHost];

// 構(gòu)造加載API 的script url

var apiUrl = "http://ditu.google.com/maps?file=api&v=2&key=" key; // 使用script 動態(tài)加載的方法加載地圖API

var scriptTag = document.createElement('script');

scriptTag.setAttribute('type', 'text/javascript');

scriptTag.setAttribute('src', apiUrl);

document.getElementsByTagName('head')[0].appendChild(scriptTag);

使用這段代碼時，需要注意把你自己的JS 代碼中對API 的各個類的調(diào)用放在API 加載完成以后，詳細的解釋可以先google 一下的問題，三言兩語還是說不清楚的，呵呵。 這段代碼我沒有實際跑過，歡迎斧正，如果你有更好的方法，我更愿意洗耳恭聽了。

使用谷歌地圖API 應該有所了解的一些技術(shù)外背景 這些內(nèi)容，常用谷歌地圖的應該也都知道，我也只寫我知道的，了解這些對使用 API 還是有幫助的。

1 、 谷歌地圖主頁

谷歌地圖對應不同的地區(qū)都會有一些專門的主頁，首次登陸時會顯示這些地區(qū)，比如，香港的： ，臺灣的： aps.google.com.tw ，日本的： 不過，我們常用的也就三個：

這個應該是谷歌地圖的全球主頁，默認顯示老美地圖，拖拽到不同地區(qū)會對應顯示不同語言版本的地圖，不過目前對中文數(shù)據(jù)搜索支持的不如下面正式的中文主頁； 這個么，我叫它是谷歌地圖的中文主頁，什么意思看下一個你就知道了，用這個可以使用 “ 我的地圖 ” ；

這個，我叫他是谷歌地圖的大陸主頁，目前還沒有 “ 我的地圖 ” 這個功能；

后面這兩個主頁只能顯示大陸地區(qū)的詳細地圖，如果想看別的地區(qū)的，就只能用全球主頁了。 當然，別以為你抓著漏洞可以注冊個 maps.google.cn ，然后賣給谷歌，不信你試試 maps.google.cn ，看它跳到哪里了 :)

2 、谷歌地圖的類型

其實，谷歌地圖的類型主要也就三種：

普通地圖：歷史悠久的人工繪制地圖，不多說了，不知道的給我留個地址，我快遞個板磚給你； 衛(wèi)星地圖：用衛(wèi)星圖片拼成的地圖，不同地圖的顯示精度有區(qū)別，現(xiàn)在中文主頁上也有了，曾經(jīng)可是被禁止的，怕你偷看海南的黑魚；

地形地圖：用等高線標出海拔的地圖，對地理教學和教育相關(guān)的相當有用，當然，對軍迷也超級有吸引力，不展開 !

把這三種組合起來 ( 主要是普通地圖和衛(wèi)星地圖的組合 ) ，或者在這些地圖上添加其他的數(shù)據(jù)，就又有一些新的類型了，這個層出不窮，我只說主頁上現(xiàn)有的：

混合地圖：就是把普通地圖和衛(wèi)星地圖結(jié)合，在衛(wèi)星地圖上顯示行政區(qū)、街道等等，在全球主頁上把鼠標移到 “ 衛(wèi)星 ” 按鈕上，會跳出來一個 “ 顯示標簽 ” 的復選框，選中后地圖就是這個類型了，中文還沒支持，不知道什么時候可以用；

交通地圖：在地圖上顯示交通信息。這個理論上是實時的，不過，在目前的中文地圖上，吸引眼球的作用更大一些，如果能在手機版上使用就好了（貌似目前還沒有），而且只有北京和上海有數(shù)據(jù)支持；

街景地圖：這個和交通地圖一樣，嚴格上不算是一種地圖類型，就是使用 Flash 來顯示街道的全景圖，我也在等中文地圖支持街景了（中文 API 已經(jīng)支持 StreetView 相關(guān)的類了，就是沒有數(shù)據(jù)），不久前看到的消息是目前谷歌對這個沒有時間表，呵呵，他是 “ 萬事俱備，只欠東風 ” ，努力吧！

在地圖 API 中，后面組合的這三種除了混合地圖算作是一種地圖類型外，其他兩個都不算是地圖類型，被看著是在地圖上新增的層（術(shù)語：疊加層 /overlay ）。

3 、谷歌地圖的數(shù)據(jù)源

谷歌是一個服務提供商，而不是一個內(nèi)容提供商，所以，準確的說，谷歌地圖向終端用戶提供的是基于地圖的搜索服務。從這一點上，可以把谷歌地圖上的數(shù)據(jù)分為三類：

地理數(shù)據(jù)：地理、空間信息，包括經(jīng)緯坐標、航拍 / 衛(wèi)星圖片、行政區(qū)劃以及據(jù)此繪制的圖片等等，由谷歌或其合作伙伴持有；

商業(yè)數(shù)據(jù)：與地理相關(guān)的商業(yè)數(shù)據(jù)，比如餐館、影院、交通、景點等等，這也是由谷歌或其合作伙伴持有，谷歌可能對這些數(shù)據(jù)有一個采集、過濾、整理的再加工過程。想被客戶搜索到，就來這里 吧；

用戶數(shù)據(jù)：用戶使用谷歌地圖 API 定制地圖并在地圖上標注的數(shù)據(jù)，這些數(shù)據(jù)由用戶持有。 這樣，通過這個分類，我們可以解決兩個非常常見的疑問：

1 ）使用谷歌地圖 API ，地圖上的數(shù)據(jù)存在哪里？

你是你的我是我的。是谷歌提供的數(shù)據(jù)，由谷歌負責；如果是你自己提供的數(shù)據(jù)，當然由你負責保存，谷歌相當于給你一個展示數(shù)據(jù)的平臺，除非你愿意把自己的數(shù)據(jù)無償貢獻給谷歌 :) 2 ）使用谷歌地圖 API ，終端用戶會通過谷歌搜索到我的數(shù)據(jù)嗎？

對谷歌地圖來說，他的數(shù)據(jù)源只有地理數(shù)據(jù)和商業(yè)數(shù)據(jù)，所以在谷歌地圖主頁上不會搜到你的數(shù)據(jù)。但是，你可以在你的地圖上定制谷歌搜索的數(shù)據(jù)源，使得用戶可以搜索你的數(shù)據(jù)。（不是很肯定的哦，要看你的具體情況的）

4 、 谷歌地圖 API

谷歌地圖 API 就是一系列使用 OO 方式組織的 JavaScript 類和靜態(tài)方法（我有時候也統(tǒng)稱為地圖 API 類庫），通過創(chuàng)建這些類的實例（對象）或調(diào)用 API 中提供的靜態(tài)方法，可以在頁面上創(chuàng)建和控制地圖，也可以在地圖上展示任何非谷歌提供的數(shù)據(jù) / 信息。谷歌地圖 API 只涉及瀏覽器 / 客戶端相關(guān)的技術(shù)，比如 JavaScript 、 HTML DOM 、 CSS 等，不涉及任何服務器端的技術(shù)，或者說，你可以基于任意你需要的服務端使用谷歌地圖 API （所以，這里面能夠展開的東東就太多了，以后再總結(jié)吧，我也在學習）。

加載谷歌地圖API 的URL 詳細解讀 谷歌地圖的 API 類庫是通過 script 標簽導入的，形式如下：

我們使用API 的時候關(guān)心的就是這個script 的src 屬性了，這個屬性也就兩個部分：路徑： ； 參數(shù)：file=api&hl=zh-CN&v=2&key=abcdefg 。 解剖一下：

1 、 路徑： 路徑在這里需要注意的就是它的域名： ditu.google.com 。

這個和 里介紹的谷歌地圖主頁的問題類似，就是說，我們主要可以使用 maps.google.com 、 ditu.google.com 、 ditu.google.cn 這三個域名，有些區(qū)別和說明：

1 ） 如果你需要在地圖上顯示大陸以外的詳細地圖，就非 maps.google.com 莫屬了，不過，這個域名對國內(nèi)地理數(shù)據(jù)的查詢 ( 比如查詢地址、路線等等 ) 支持能力有限，如果你這方面有需求就要小心了，而且，這個應該是使用的國外的服務器，所以，訪問速度也需要注意；

2 ）相反，如果你需要使用谷歌提供的與國內(nèi)地理數(shù)據(jù)查詢相關(guān)的 API ，就是用 ditu.google.com 吧，使用這個域名的缺點就在于它和 maps.google.com 提供的類庫不是完全一致，更新稍微有點滯后，而且，受限于國內(nèi)數(shù)據(jù)源在法律等方面的限制，有些功能方面的支持也會受限，比如地址解析（現(xiàn)在已經(jīng)放開了，這里只是拿來舉例）；

3 ）至于 ditu.google.com 和 ditu.google.cn 的區(qū)別，我也很糊涂，如果你很想做個聽話的好公民，不出一絲差錯，那么 .cn 可能會比 .com 更讓你放心一點吧，臆測，呵呵。

總得來說，一般的應用使用 ditu.google.com 就可以了，如果需要使用大陸以外的詳細地圖，就考慮使用 maps.google.com 吧。不過，因為使用了相同的命名空間，這兩者在一個頁面中不能共存，所以，可以考慮用兩個 iframe 來動態(tài)切換，這里有個的例子，就是這么實現(xiàn)的，咱當初也貢獻過一把。

2 、 參數(shù)：file=api&hl=zh-CN&v=2&key=abcdefg

1 ） file=api

這個是請求API 的JS 文件用的，少不了，不需多說；

2 ） hl=zh-CN

這個是在設(shè)定地圖上除了地圖圖片以外的諸如控件名稱、版權(quán)聲明、使用提示等所需要顯示文本的語言版本時候用的，如果沒有指定這個參數(shù)就使用 API 的默認值，對 ditu.google.com 來說，默認是中文簡體， maps.google.com 默認的是英文。其他的語言版本在這里有一個 （好像好久沒更新了）。

3 ） v=2

這個是用來指定需要導入的 API 類庫的版本號，可以有四種設(shè)定方式：

v=2.s 穩(wěn)定版本，更新最慢，但是最可靠；

v=2 當前版本（只用主版本號），更新速度和可靠性介于 s 和 x 之間；

v=2.x 最新版本，更新最快，包括最新功能，可能沒有當前版本可靠；

v=2.76 指定版本。不建議使用。

目前谷歌地圖 API 的主版本號是 2 ，這是從 2006 年 4 月開放的版本，對之前的第 1 版做了一些比較重要的升級，不過估計國內(nèi)用第 1 版的應該很少，所以也沒必要多說了，注意第二版里定義地圖對象時使用 GMap2 而不是 GMap 就可以了，否則可能會導致一些奇怪的問題，我是見過這樣的。

多羅嗦兩句，谷歌地圖 API 正常情況下還是相當穩(wěn)定的，不過也有一些比較著名的 Bug ，比如超長的 Polyline 在某些特定環(huán)境下可能會顯示不正常。萬一有什么問題可以去這里 Bug （英文版），當然，更簡單的辦法是到谷歌地圖 API 論壇里問問，不過別忘了把你的問題、運行環(huán)境描述清楚。我碰到過很多次這樣的情況：對 JavaScript 或者瀏覽器端的某些技術(shù)特性不是很了解，出了一些奇怪的問題，撂一句話就走人，唉，就不評論了， “ 活到老學到老 ” 還是很有道理的。

4 ） key=abcdefg

這個是設(shè)定你注冊的 API 密鑰，我 ，不是很了解的話可以看看。使用JavaScript 創(chuàng)建地圖步驟詳解

一段經(jīng)過精簡的代碼：

新建一個空白的文本文件，把上面這段代碼copy 過去，不要改變代碼的任何順序，然后把這個文本文件保存為html 文件，使用瀏覽器打開（不要使用MS 的IE ），看看你能看到什么！對這段代碼的詳細解釋

上面的這段代碼就是創(chuàng)建一個地圖的核心步驟：

1 、導入地圖 API 類庫。

注意這里的參數(shù)key ，我在以前的文章里已經(jīng)詳細解釋過了，如果你只是在本地運行，暫時可以不用管它。

2 、在頁面的 body 元素中定義一個地圖容器。

這個地圖容器一般使用div 元素來定義，如果你愿意，使用p 元素或者其他你能想到的元素都可以，但是都應該是塊元素，并且必須定義它的id ，保證在后面的步驟里能夠通過

document.getElementById 找到這個元素。

容器的 style 屬性在這里是用來定義這個容器的大小，從而決定所顯示地圖的大小，當然，如果你在這里不定義也可以通過其他的手段來達到目的，這里暫且先認為這個 style 的定義和 id 屬性一樣也是必不可少的吧。

其實 body 元素在這里也有一些特殊的作用，就是保證下一步驟在頁面的 html 元素全部加載結(jié)束后再執(zhí)行，詳細的理論就不細說了。

3 、定義你自己的 script 區(qū)域，在里面 new 一個 GMap2 對象，并且指定其顯示所需的兩個基本要素：中心、縮放層次。

這里的GMap2 是谷歌地圖API 中最重要的核心類，對應在頁面上顯示的地圖，所有對地圖的操作都需要在已經(jīng)創(chuàng)建（new ）了GMap2 對象的基礎(chǔ)上才能夠進行。在調(diào)用GMap2 構(gòu)造函數(shù)是使用的參數(shù)就是在上一步定義的地圖容器，DOM 對象，使用document.getElementById 獲取。 要在頁面上正常顯示地圖，僅僅調(diào)用 GMap2 類的構(gòu)造函數(shù)創(chuàng)建一個 GMap2 對象還不夠，你還需要指定這個 GMap2 對象的中心，通常也順便指定它的縮放層次，否則就會默認顯示縮放層次

為 0 。

要指定新創(chuàng)建地圖的中心，需要使用地圖 API 里面定義的另一個常用類 GLatLng ，可以把這個類簡單的認為是對地理坐標的封裝類，構(gòu)造函數(shù)中第一個參數(shù)是南北向的緯度，第二個參數(shù)是東西向的經(jīng)度。

調(diào)用 GMap2 的 setCenter 方法設(shè)定完地圖的中心和縮放層次，這個地圖就可以正常顯示了。

還需要關(guān)心的幾個問題：

上面的示例代碼僅僅是為了顯示一個試驗性質(zhì)的簡單地圖，所以把很多暫時不是很必要的代碼都去掉了，如果你需要創(chuàng)建具有很好的兼容性、并且能夠發(fā)布到你自己的網(wǎng)站上的地圖，還需要注意這幾個問題：

1 、為了保證有足夠的兼容性，谷歌建議使用 XHTML 來定義顯示地圖的 html 頁面，所以，你需要在這個頁面的頂部聲明 XHTML 的 DOCTYPE ，并且在 html 中聲明 XHTML 的命名空間

"-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtmll/DTD/xhtmll-strict.dtd">

當然，最好你自己的頁面代碼也能夠符合 XHTML 的語法規(guī)則。相對我們現(xiàn)在的 HTML4.01 來說，可以把 XHTML 語法規(guī)則簡單的歸納如下：

html 、 head 、 title 、 body 元素一個都不能少，并且只能有 html 一個 root 元素； 不要使用簡化的屬性，必須使用 “name='value'” 的形式；

標簽名和屬性名都用小寫字母，屬性值要用引號括起來；

標簽必須是閉合的，并且不能交叉嵌套；

使用 id 屬性而不是 name 屬性來獲取元素；

2 、為了兼容 “ 偉大的 ”IE 瀏覽器，以便能夠在 IE 中也正確顯示地圖中的折線，需要在 html 標簽中增加對 VML 命名空間的聲明

這個很容易忽略，導致你在 IE 里的折線不能正常顯示，所以把這一點單列出來加以強調(diào)。 3 、對于通用的瀏覽器兼容性檢查，地圖 API 提供了一個全局方法 GBrowserIsCompatible()來保證地圖 API 是在它所兼容的瀏覽器里運行的，這個兼容瀏覽器列表我也沒找到最新的，谷歌文檔里給出了一個遠古時代的列表，所以不列也罷，對我們目前通用的 FireFox 、 IE 、 Safari 、 Opera 瀏覽器里運行地圖 API 都沒有問題。

這里只說一下GBrowserIsCompatible() 這個方法的使用：

從名字也可以看出，GBrowserIsCompatible() 方法返回一個boolean 類型的值，所以，把我們對地圖操作的起點放在對這個方法返回值的判斷塊中，形如：

if(GBrowserIsCompatible()){

// 開始創(chuàng)建和操作地圖

} else {

// 如果有必要，就在這里定義你對這個異常的處理

}

當然，在你自己的代碼中，針對不同的瀏覽器環(huán)境你還是需要自己實現(xiàn)兼容性的代碼，這里的GBrowserIsCompatible() 只是保證地圖API 類庫是在它兼容的環(huán)境中運行的。

4 、注冊你要發(fā)布頁面所在網(wǎng)站的谷歌地圖 API 密鑰，替換掉示例代碼里的 key ，我 ，不多說了。

5 、為了保證你的頁面在任何可用的網(wǎng)絡環(huán)境下都能快速加載并且正確顯示，建議定義 body 元素的 onload 方法，在 onload 方法中開始你的 JS 動作。同時，把讀入地圖 API 的 script 標簽放在 head 元素中，而把你自己的 JavaScript 代碼塊放到 body 標簽的后面去定義。如果對瀏覽器的加載順序比較熟悉的話，你就不必遵守我說的規(guī)則了，自由定義你認為應該的 JavaScript 聲明順序。 6 、為了避免 JavaScript 中引用頁面的 DOM 元素可能存在的內(nèi)存泄漏 ( 尤其是在 “ 偉大的 ”IE 瀏覽器中 ) ，你需要使用地圖 API 中定義的 GUnload() 方法作為你的 body 元素的 onunload 方法，并且最好把這個作為一個必須的規(guī)則記住。但是 GUnload() 方法不是避免內(nèi)存泄漏的大力丸，所以，你在自己的代碼中還是需要注意避免內(nèi)存泄漏這個問題。

7 、為了能夠在頁面上正常顯示中文，需要把頁面的字符集定義為 utf-8 。

所以，一個完整的應用谷歌地圖API 的頁面代碼如下：

"-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtmll/DTD/xhtmll-strict.dtd">

怎樣在你的網(wǎng)頁里嵌入地圖