Google Map API使用詳解(十一)——使用JavaScript建立地圖詳解(下)

來源:互聯網
上載者:User

還需要關心的幾個問題:

上面的範例程式碼僅僅是為了顯示一個實驗性質的簡單地圖,所以把很多暫時不是很必要的代碼都去掉了,如果你需要建立具有很好的相容性、並且能夠發布到你自己的網站上的地圖,還需要注意這幾個問題:

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

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

<html xmlns="http://www.w3.org/1999/xhtml">

當然,最好你自己的頁面代碼也能夠符合XHTML的文法規則。相對我們現在的最新HTML版本來說,可以把XHTML文法規則簡單的歸納如下:

html、head、title、body元素一個都不能少,並且只能有html一個root元素;

不要使用簡化的屬性,必須使用“name='value'”的形式;

標籤名和屬性名稱都用小寫字母,屬性值要用引號括起來;

標籤必須是閉合的,並且不能交叉嵌套;

使用id屬性而不是name屬性來擷取元素;

為了相容最新版本IE瀏覽器,以便能夠在IE中也正確顯示地圖中的折線,需要在html標籤中增加對VML命名空間的聲明

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">

這個很容易忽略,導致你在IE裡的折線不能正常顯示,所以把這一點單列出來加以強調。

對於通用的瀏覽器安全色性檢查,地圖API提供了一個全域方法GBrowserIsCompatible()來保證地圖API是在它所相容的瀏覽器裡啟動並執行,這個相容瀏覽器列表我也沒找到最新的,Google文檔裡給出了一個遠古時代的列表,所以不列也罷,對我們目前通用的FireFox、IE、Safari、Opera瀏覽器裡運行地圖API都沒有問題。

這裡只說一下GBrowserIsCompatible()這個方法的使用:

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

if(GBrowserIsCompatible()){

//開始建立和操作地圖

} else {

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

}

當然,在你自己的代碼中,針對不同的瀏覽器環境你還是需要自己實現相容性的代碼,這裡的GBrowserIsCompatible()只是保證地圖API類庫是在它相容的環境中啟動並執行。

 

4、註冊你要發佈頁面所在網站的Google地圖API密鑰,替換掉範例程式碼裡的YOUR_API_KEY。

 

5、為了保證你的頁面在任何可用的網路環境下都能快速載入並且正確顯示,建議定義body元素的onload方法,在onload方法中開始你的JS動作。同時,把讀入地圖API的script標籤放在head元素中,而把你自己的JavaScript代碼塊放到body標籤的後面去定義。如果對瀏覽器的載入順序比較熟悉的話,你就不必遵守我說的規則了,自由定義你認為應該的JavaScript聲明順序。

 

6、為了避免JavaScript中引用頁面的DOM元素可能存在的記憶體流失(尤其對於IE瀏覽器),你需要使用地圖API中定義的GUnload()方法作為你的body元素的onunload方法,並且最好把這個作為一個必須的規則記住。但是GUnload()方法不是避免記憶體流失的萬能鑰匙,所以,你在自己的代碼中還是需要注意避免記憶體流失這個問題。

 

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

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.