什麼是 Google 地圖 API?
「Google 地圖 API」可讓您利用 JavaScript 將「Google 地圖」嵌入自己的網頁。此 API 透過多種服務提供一些公用程式,以操控地圖 (如同 http://maps.google.com 網頁上所示),並新增地圖內容,能讓您在網站上建立強大的地圖應用程式。
也就是說 你可以利用GOOGLE地圖的模組來在自己網頁上顯示各種不同的標示方法
例如 按下按鈕後 直接到 某個座標
在GOOGLE地圖上顯示自己公司的資訊及照片
貼上自訂的圖示標示商店分布圖等等
相當多的功能可以讓你自己設定
而這一切都只需要JavaScript就可以了
當然GOOGLE也很貼心的寫了很多範例 你可以參考他的寫法來改成自己要的表示方式
相當簡單不會寫程式也可以用唷~
那我們要使用這個API
首先要先為你的網站申請一個金鑰
到這個地方申請,拉到最下面
把I have read and agree with the terms and conditions勾起來
將你的網站網址貼到My web site URL:裡面
她是可以向下支援的
例如你的網域是http://test.ABC.com/
那http://test.ABC.com/page1/ , http://test.ABC.com/page2/
都是可以使用低
按下確定後
她就會給你一組長長一條很像亂碼的金鑰,像這樣
Your key is:
ABQIAAAAg7ts_tlo3cTYNroqXGBCThS83-cXub6Htj8tD-r5AQYP1awDpRT4jOTRx
1GvRrHVU2zqkRn1_Dv_ww
請把它存下來
然後可以到這個頁面看他的範例
找到你想要使用的地圖模式後
你可以直接再那一個頁面看他的原始碼
然後把它的金鑰改成你剛剛申請的那一組
貼到你的網頁上面就可以了
像這樣
/span>"-//W 3C //DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
"http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
"content-type" content="text/html; charset=utf-8"/>
ABQIAAAAg7ts_tlo3cTYNroqXGBCThS83-cXub6Htj8tD-r5AQYP1awDpRT4jOTRx1GvRrHVU2zqkRn1_Dv_ww "
type="text/javascript">
>
function initialize() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
map.setUIToDefault();
}
}
"initialize()" onunload="GUnload()">
紅色部分就是金鑰 內容很單純,應該一看就知道哪裡可以改參數(座標、圖示、階層等等)了 自己研究一下吧 另外這裡有一個很方便的測試區Code Playground 讓你可以直接改程式碼後看效果 也是相當方便