Google Map & Google Earth API Mashup 實作

這幾天在幫另外一組的同學趕工，他們的project是要利用Google earth plugin來重建美國Route66沿路的風光，藉由裝載在一台真實的車子內（他們還真的搞來一台beetles），讓使用者有Road trip的虛擬體驗。

很可惜的是三個人當中沒有人真的懂程式語言，拜託我的時候程式碼已經改到一個面目全非的地步，我判定這個砍掉重練可能都比再改寫還來的快，因此就抓了原始的Milktruck Example來大改...

其實他們的需求並不難，其一是車子撞到景點會跳出另一個顯示屏秀出該景點的資訊，用一個大的Array把這些資料包住，指向特定html頁面，撞到的時候再用AJAX呼叫就是了。

另一個目標是他們想用分割螢幕，右側顯示的是GMAP標定車子的所在位置，也就是我今天主要Demo的東西。

首先google官方給的milktruck範例內有一個tick function，算是主迴圈，在主迴圈內會不停的更新經度緯度的資訊，想辦法把經度緯度丟給google map去更新位置，這樣一來應該就能達到同步。

幾個要注意的地方：

一、如果直接把request綁在主迴圈不加條件式限制，Google map api應該會把你ip視為攻擊而ban掉（50萬requests的扣打應該馬上爆掉吧），因此看是要每隔固定時間去做一次reload亦或是車子每行走一段距離後做reload會是比較好的做法。個人是採用後者。

二、Google map 元件的呼叫比我想像中來的簡單，create出物件之後，先抓到對應在HTML的div區塊，之後再把經度緯度餵進去就可以順利產生了，要注意的是經緯度這些東西都要先轉換成Google的座標物件才能餵喔。

試看看吧，Milktruck++