[教學]如何使用 Time Machine X 撰寫整合照片、軌跡的Google地圖並內嵌在部落格(相片、maps、Blog)

<2007.12.19 beta 4 修正版>

本文同步刊登於台灣大樹的部落格

[教學]如何使用 Time Machine X 撰寫整合照片、軌跡的Google地圖並內嵌在部落格(相片、maps、Blog)

感謝賴大日以繼夜、焚膏繼晷的工作,完成這套 Time Machine X ver 2.6,這次改版中最讓部落客興奮的地方是加強了部落格出版功能,可以輕鬆的做出一張整合照片、軌跡的Google地圖來內嵌在部落格內,所以愛旅遊的部落客們,趕快指名 WINTEC 的 WBT201 或是 Easy Showily,就是你最好的選擇!

如果你買的是其他軌跡紀錄器,請參看[教學]如何用Gpsvisualizer在部落格內放入整合GPS軌跡和照片的Google 地圖? 一文。

目標:本文是教授大家使用wintec的Time Machine X 來製作像下圖一樣整合照片、軌跡的Google地圖並嵌入部落格(相片、maps、Blog)。
本圖於無法顯示,煩請連至台灣大樹的部落格觀賞



在此是以免費網路空間 Google Pages 和 網路相簿 Picasa 來做例子,首先您需要先準備好:


  1. Google Account,詳情請參考如何建立GOOGLE 帳戶一文。
  2. Google Pages 網站,詳情請參考Google Pages教學一文。
  3. 針對你的網站申請一組Google API Key,並在Time Machine X的"軌跡編輯"=>"製作報告"貼上剛申請的Google Maps API Key。申請說明如下:
    (1)進入API Key申請網站,在圖示處打勾並輸入你申請的Google Pages網址,而後按下Generate API Key按鈕。

    (2)複製這個網頁的API Key。

    (3)貼在Time Machine X 的的"軌跡編輯"=>"製作報告"頁面上。

  4. 安裝Picasa軟體,可以參考下載安裝Picasa一文。

接著要開始今天的重點了。

  1. 用Picasa軟體上傳相片到Picasa網路相簿,請參考免費Picasa網路相簿照片上傳教學一文。
  2. 接著登入Time Machine X,選擇軌跡編輯=>製作報告=>滑鼠點兩下你要展示在地圖上的軌跡。
  3. 用Google帳戶登入picasa網路相簿,選擇你要嵌入的相片,點選右側的詳細資訊&連接到此相片。
  4. 複製內嵌於網站的HTML。

  5. 於製作報告與儲存標籤中將上圖的經度、緯度填入TMX的標記經度、緯度。
  6. [ 方法一 可填入相片名稱並顯示縮圖 ]內嵌於網站的HTML內容是這樣:

    <a href="http://picasaweb.google.com.tw/帳戶/相簿/照片的連接"><img src="http://lh4.google.com.tw/帳戶/照片網址.JPG" />

    • 將上面HTML後面的img src="照片網址URL",貼入下圖「照片網址URL」;上面HTML前面的 a href="照片的連接"貼入下圖「照片的連接URL」
    • 按下檢查標記確認照片出現在地圖上位置正確,即可按下新增此標記加入地圖,地圖上會出現縮圖標記。

  1. [ 方法2 懶人法 ]直接把嵌入網站的HTML貼入下圖的HTML語法欄位中,檢查標記確認無誤後,即可新增此標記,則地圖上會出現i。

  2. 將所有照片都新增後,即可按下開始製作報表。

  3. 系統會開啟IE,請按右鍵允許被封鎖的內容。

  4. 就可以看到完整的圖表啦。

  5. 接下來回到TMX按下儲存報表。

  6. 系統會預設用該軌跡第一點的日期時間開啟新資料夾儲存。系統會預設儲存在C:\Program Files\Time Machine X\REPORT目錄下的新資料夾,您可以將整個資料夾轉寄給朋友,就可以看到一樣的報告了。

  1. 進入google pages網站,按下右側下方的UPLOAD鍵,上傳 C:\Program Files\Time Machine X\REPORT\日期時間\BLOG\內的 GM日期時間.html、GM日期時間.xml及loading.gif(第二次以後不須上傳loading.gif)。


  2. 再來在自己的部落格貼上下面網址
    <iframe src='http://你的google帳戶.googlepages.com/GM日期時間.html' scrolling='no' style='width:寬度px; height:高度px' frameborder='0'>

    就可以把地圖嵌入在部落格了!!

本圖於無法顯示,煩請連至台灣大樹的部落格觀賞


報告完畢,謝謝大家!


Dear tonylee5405,

看到你修改GM.xml與GM.html
害我都愧疚了起來
對某些人來說那實在有點複雜

好吧 等一下我再放beta4
我會修改讓大家不用在重新命名
tonylee5405 wrote:
又用TMX寫了一篇,...(恕刪)


大樹大大,這篇很實用耶,
看完後真是受益良多:D
文章分享
評分
評分
複製連結

今日熱門文章 網友點擊推薦!