黃天駿 攝影 繪畫 Web2.0 Google Blog GPS GIS
[攝影]鼠年春節隨拍。旗山外婆家 [Taipei101]春到福正。月兒依人
2 月 24

[Google Code]Static Maps API

去年底 Google 推出了 Chart API,讓大家可以使用網址來畫圖表,現在 Google Maps 也不惶多讓,推出靜態(圖片)式地圖 Static Maps API,讓網友們使用網址就可以畫地圖囉!

Google 的 Static Maps,如果有在使用 Google 的人應該不陌生,它會出現在一般網路搜尋及地圖搜尋中(當 javascript disable 狀態時),但是把這功能與眾多鄉民分享,我想也只有那麼有錢的 G 大神辦的到。

以下圖為例,藍色的標記是 101 大樓,綠色的標記是我最常拍攝 101 的點。


雖然 Google Maps 已提供崁入地圖的功能,但是使用 iframe 插入一個很消耗資源的網頁,是很多人在使用 Google Maps 置入自己網頁的痛,現在出了 Static Maps 功能,或許沒有直接崁入一個地圖方便,但是相當輕巧靜 Static Maps 應該會受歡迎

那…要怎麼使用 Static Maps API 呢?

使用 Static Maps API 前要先申請 Google Maps API Key,如果有了就不用再申請囉!

依據目前文件說明,Static Maps API目前有下列幾個參數…

  • center

    圖片的中心定位點(經度,緯度),本參數不寫時,地圖繪依據標記的佈局計算中心點。

  • zoom

    地圖縮放大小,依照 Google Maps 經驗應該是可以設成 1~18,但是各地圖資不一,所以放太大也許會沒東西喔!
    本參數不填,Google 會依據標計選出最適合的地圖比例大小。

  • size

    圖片大小(寬x高)

  • maptype

    地圖格式,分為網路(roadmap)與行動裝置(mobile),Google 會依據參數產出不同格式的地圖(圖例:網路行動裝置;注意到了嗎?Google 貼心的依據不同裝置的情況下視覺上的差異,修正了 Google Maps …果然是神啊~)。

  • markers

    地圖標記,可以設n個參數用法(經度,緯度,顏色文字),使用 "|" 符號做分格,可設red,green,blue三個顏色,顏色後直接英文字母(大寫),該標記就會現是英文字,否則為一般標記。

  • key

    Google Maps API Key

以下就是上圖的URL參數解析:

http://maps.google.com/staticmap?
center=
&zoom=14
&size=500x400
&maptype=roadmap
&markers=
25.03345693906047,121.56445026397705,blue
|
25.03345693906047,121.53355121612549,green
|
25.032970889180913,121.55951499938965,green
|
25.03849230249491,121.55818462371826,green
&key=你的API Key

網路圖例:

行動裝置圖例:

後記:

不知道怎麼找到經緯度嘛?可以試試這個喔!

標籤:, , ,

工坊史上的今天:

目前有 19 回應 to “[Google Code]Static Maps API”

  1. 回風落雁劍 回應到:

    很詳細溜!推推推!(y)

  2. jerome 回應到:

    讚!我好久沒去研究 Google Map 囉!

  3. Tanjun 回應到:

    @回風落雁劍:
    社長,謝謝啦!

    @jerome::
    哈~也沒什麼研究啦…只是剛剛好看到官網發佈…所以就就看一下…

  4. yuan 回應到:

    試了一下,地圖好像不能直接進到Flash , 會得到「URLNotFound」的結果。

  5. Tanjun 回應到:

    @yuan:
    剛剛有用 flash 試了一下,發覺果然不能連到圖片…
    果然出現以下錯誤:
    > errorCode: URLNotFound
    > httpStatus: 400
    看來 Google 有做某些防護措施…
    可能要用地三方程式來產生圖檔,經你這麼一說 Static Maps 用在 Flash 應該會有不錯的火花… :)

  6. d 回應到:

    另有Maps API for Flash

  7. Tanjun 回應到:

    @d:
    是阿!有 Maps API for Flash,這要 Flash 高手才會用。

  8. IAN 回應到:

    天天大大你好

    想要請教一下
    如果 想要在 標的點上面 在加上文字
    例如說 我要再101的那個點旁邊顯示101
    這樣會有辦法嘛
    謝謝你

  9. tanjun 回應到:

    @IAN,
    目前圖標僅能標是顏色以及代號(A~Z)而已喔!

  10. IAN 回應到:

    嗯嗯 謝謝大大嚕

    那麼 可以 在上線標記路線嘛

    假如我想要標記自行車河濱的腳踏車道

    有辦法嘛 還是說 只能標點而已

    謝謝

  11. Tanjun 回應到:

    @IAN,
    靜態的地圖目前沒看到開放劃線(劃線的難度也很高)。
    你可以使用 My Maps 做你想要的應用,再發佈成 iframe 嵌在網頁中。

  12. IAN 回應到:

    我有想過要用MY MAPSㄉ功能去做
    但是 因為我是要放在手機上面顯示的
    MY MAPS 在我寫的程式跑不出來

    所以才換成現在用圖片顯示地圖的方式

    有點麻煩 還是請問你知道手機上 如何顯示一般電腦使用的地圖嘛

    謝謝

  13. Tanjun 回應到:

    @IAN,
    行動裝置方面較不熟,抱歉囉!

  14. IAN 回應到:

    不好意思喔 又來打擾
    請問一下 你說 要標英文字母
    直接在後面標(大寫)
    請問是這樣嘛
    25.03345693906047,121.56445026397705,blueF|
    這樣子就可以了嗎
    還是有另外的寫法
    謝謝大大!!!

  15. Tanjun 回應到:

    @IAN,
    他有一定的格式啊!就是這樣寫而已…. :D

  16. IAN 回應到:

    不好意思 可是我測試
    但是很像不行顯示耶

    下面是我測試的網址
    http://maps.google.com/staticmap?center=&zoom=14&size=500×400&maptype=roadmap&markers=25.03345693906047,121.56445026397705,blueA|
    25.03849230249491,121.55818462371826,green&key=
    我的API KEY

    不好意思 可以麻煩幫我看看是哪裡錯誤了嘛 謝謝

  17. Tanjun 回應到:

    @IAN,
    我的測試是 OK 的喔!
    注意大小寫,應該全都是小寫。

  18. IAN 回應到:

    哈哈 謝謝大大

    我成功了 感謝你的幫忙!!

  19. Google 靜態地圖 API:staticmaps – weber - 無呈現的網路筆記 回應到:

    […] 認識 Google Maps API Google 靜態地圖 API [Google Code]Static Maps API » : 天天工坊‧blog 取得經緯度 » […]

留下回應:

您現在瀏覽回應的網站是 :天天工坊‧Blog: