之前Instagram有一個在地圖上顯示照片的功能，可惜後來這個功能去掉了。INS的官方說法是因為這個功能的使用率很低，因此最後捨棄了這個功能。其實我覺得這個功能還蠻好的，看到自己的照片遍佈全世界很有成就感啊！實驗室的同學也覺得這個去掉這個功能很可惜，大家都看不到自己去過哪裡了。於是同學做了一個網頁用來顯示Instagram的照片。大家感興趣可以戳一下這裡（需翻牆）：Instagram Map. 程式碼戳這裡：Instagram Map Code.

進入網頁後需要登入自己的Instagram帳號，之後網頁會自動讀取賬戶裡有打卡記錄的照片顯示在讀圖上。下面是我的Instagram帳號的顯示效果。

點選照片後會顯示照片的詳細資訊，包括拍攝日期，打卡地點以及圖片的說明。效果如下。圖中『奇萊南峰-3358m』即為打卡地點。這個地點是使用者上傳圖片時從INS提供的幾個候選地點中選的。

但是僅僅是簡單地根據打卡地點將照片顯示在地圖上會有問題。因為很多照片的打卡地點是一樣的，這樣顯示的照片是重疊的。好在google提供瞭解決方法：MarkerCluster，可以將同一地點的照片分開；同時也實現了縮放地圖是照片聚集分散的效果。

其實只顯示Instagram的照片對我來說不太夠。我手機有5000多張照片（我是多麼愛拍照~），都會同步到Google Drive（Google Drive與院校合作開放了無限量的儲存空間）；但是我時不時會『精選』一些照片修下圖（我是多麼悶騷），然後同步到OneDrive（因為Google Drive在國內不好用，原因懂的……但是好像OneDrive現在在國內用起來也不是很方便？），現在修過的照片也累計到300多張了，是時候展現一下了……

在同學程式碼的基礎上，我直接連線了OneDrive賬戶然後獲取照片列表記錄，之後顯示在地圖上。OneDrive的照片沒有打卡地點，只有經緯度座標，因此還要利用Google Map的API將經緯度轉換為字串的地址（逆向地理編碼，Reverse Geocoding），因此顯示的地點都怪怪的。同樣地，OneDrive裡的照片都沒有照片描述，因此顯示出來的照片就沒有描述資訊了，不過之後想著用Google Vision API或是Microsoft的API自動生成照片描述。當然這種機器生成的描述資訊也是怪怪的，都是關鍵字的堆疊。

OneDrive的照片顯示效果如下，只顯示有座標的照片。

寶島臺灣的照片顯示效果如下。分佈跟Instagram差不多，只是數量有一些差別。

點選圖片，顯示的地點是經緯度轉換而成的詳細地址。

目前顯示的照片有點問題，縮小地圖檢視時有些照片會有重疊，如下圖所示，標有數字3的照片顯示有問題。但其它單獨顯示的兩種照片沒有問題。放大地圖顯示照片時正常。還沒有找到原因。估計是OneDrive獲取的縮圖尺寸大小的問題或是縮小檢視時多張照片疊加顯示的問題。

連線OneDrive獲取照片

連線OneDrive費了我一番功夫。OneDrive提供了一個簡單的例子：OneDrive Explorer JS. 我的code便是在這個例子上修改而成。從OneDrive中獲取照片並顯示在Google Map上的程式碼如下：Foto-Map. 目前是第一個版本，可能會有一些bug，也不會有多好看。