Vue JS 自今年四月 (2016/04) 發佈 Vue 2.0 preview 版本至今也有五個月了，在新舊版本的交替之中，開發者最關心的一定是「我的專案能不能升到 Vue 2.0」、「升上去會不會爆」、「專案該用那個版本來開發」，「聽說隔壁那個 ng 升級幾乎等於砍掉重練」 之類的問題。

最近 Vue.js 正夯，所以手上幾個東西打算用這個來改寫，關於 Vue.js 的基本介紹可以參考小弟的投影片，這裡就不再贅述。

利用 d3.js 我們可以很輕易地產生我們想要的圖表，以最常見的長條圖為例，只要透過 scale (比例尺) 與 axis (軸線)，再加上一點 SVG 的基礎知識，像這樣的長條圖一下子就可以生成。

感謝台北市政府以及相關人士的努力，在十月中旬的時候，台北市 open data 平台又開放了「台北市住宅竊盜點位資訊」這樣的資料，雖然很多人戲稱房價又要下跌了，但是老話一句，身為有良心的開發者，當然居住安全比房價什麼的還要重要得多。

看到前兩天的新聞: 柯文哲想公開易淹水地區 北市府已上網，又剛好有前輩寫了一篇 利用QGIS檢視台北市降雨淹水模擬圖，雖然身處房仲業，但身為有良心的開發者不能只想著房價，心想應也可透過 Google Map 來呈現，於是試了一下，順便寫篇記錄。

大家都知道，JavaScript 的變數有其作用域的範圍，若使用前未經 var 宣告，就會自動變成全域變數 (global variable)，而在其 code block 內宣告的變數也只有該 code block 內可以使用。

這次我在 Taipei D3.js Meetup (現在似乎改叫 Visual Thursday) 分享的 Talk 是有關於地理視覺化的簡介，雖然題目聽起來很學術，但其實內容是我這陣子對於 Web GIS 以及地圖視覺化的一些摸索心得分享。

因為從臺北市政府資料開放平台 API 拿到的資料是 TWD97 座標格式，所以我們必須要將它轉成經緯度後才能套用至 Google Map 使用。網路上查了很多資料，最後找到最親民的是米蟲大的 PHP 版本，於是就改成寫我最熟悉的 JS。

上一篇提到了如何在 Google Map 裡面加入 D3 的圖像，這次我們實際將資料套進去吧。

因為昨天 台北市政府開放平台 開始提供 臺北捷運各站進出量統計 的統計資料，所以就在思考可以利用這份資料做什麼應用，第一個想到的就是能否透過 D3 與地圖的共同呈現，當然就從我最熟悉的 Google Map 開始。