WTF…單篇文章內的 Google Maps

[2015.12.25 UPDATE] 本篇作廢:許多套件都已經失效不再更新,所以決定放棄龜毛的在地圖上每個地方打上標記的念頭。

在寫 Long road to Barcelona 的時候,為了要把相對應的地點用地圖表示,所以花了很多時間想解決辦法。 我的需求包含下面幾項:

  • 互動性:地圖可以隨意調整比例尺。
  • 自訂性:地圖上的功能可以自訂,不然畫面會太雜亂。
  • 地圖上一定要看得到比例尺。
  • 每個地圖標記可以增加額外的說明。

Google Map 內建的「連結」當然是個好選擇,要控制圖片尺寸還可以從「自訂和預覽內嵌地圖」裡面進行調整。不過問題在於:

1

  • 產生的程式碼為 Iframe 格式, WordPress 內建的編輯系統因為安全性考量並未直接支援。會造成貼完下次編輯會被吃掉,解決方法也相當麻煩 ((wordpress官方尚未主動解決前,只要編輯該篇文章時,編輯器模式維持為「程式碼模式」而不切換到「可視化模式」直接發布就永遠不會被吃掉。)) 。
  • 沒辦法簡單描述針對多個標的地點。

原先採用的是 MapPress Easy Google Maps 這個 plugin,透過簡單的語法就可以將數個地點一口氣標完。 好景不常,最近改版的1.4裡頭的語法得重新改寫。更重要的一點,雖然程式碼在文章中變得更為簡潔,但似乎一篇文章就只能內嵌一個地圖(默)。在翻遍網站的相關說明之後,決定另尋其他plugin(泣)。

現在很晚了,直接打結論…後來選了 XML Google Maps ,稍微交待一下我是怎麼使用的(因為試很久才搞清楚) XD。

  1. 登入 Google的帳號,選擇「我的地圖/建立新地圖」。
  2. 標題說明的部份自己打理,似乎不太重要(笑)。
  3. 「利用上方的搜尋」或者「直接將地圖拉到你想要標示的地點」。
  4. 選擇「新增地圖標記」。

    2

  5. 點選之後會跳出新標記點。移動滑鼠將標記點放在想要的地點,並按下左鍵。接著系統跳出視窗就可以填寫相關說明。也可以點選右上方的藍色方塊改變標記圖形。

    3

  6. 標記完所有地點之後,按滑鼠右鍵選擇「在 Google 地球中檢視」,並複製連結位置 ((「在 Google 地球中檢視」這個選項只會在正在編輯地圖的時候才會出現。)) 。

    4

  7. 回到Wordpress文章編輯畫面。輸入一段文字,選擇「插入鍊結」。

    5

  8. 將「在 Google 地球中檢視」所得到的網址貼上,其他選項隨興。

    6

  9. 地圖將會在正式發表之後出現,在編輯狀態是看不到的。

希望這次就可以一勞永逸,不然就直接貼圖算了 orz,真不知道到底在龜毛什麼(遠目)。

發表迴響

你的電子郵件位址並不會被公開。 必要欄位標記為 *