下面投影片是這次小弟在 Modern WebConf 2015 分享的主題，內容是有關 D3 開發的一些心得。

早上開會時，同事提到了 Android 升級後，Chrome for Android 會出現網頁畫面在瀏覽器頂端時，往下拉會重整頁面的問題(其實應該說是 Feature XD)，因為這個新功能會造成網頁使用上的一些困擾，於是試了幾種方式，發現可以阻擋網頁重整的動作，趁還有印象就把它記錄下來。

因為每次轉檔都要查，索性把步驟記錄下來。

首先要安裝 GDAL (Geospatial Data Abstraction Library) 這個程式， 因為我是用 Mac ，所以在 terminal 輸入 brew install gdal 就可以了。

做法很簡單，就是做兩個 d3.svg.arc() 然後在 mouseover & mouseout 的時候改變 d 屬性即可。

這裏就拿 http://bl.ocks.org/mbostock/3887193 作為範例。

前陣子因為工作的需要，稍微研究了一下 Google Map 提供的 HeatMap (熱點圖/熱圖) API，實作方面也滿容易的，在這裡就簡單做個紀錄。

在說明 Google Map 如何存取 GeoJSON 前，先來簡單介紹 GeoJSON。

前陣子因為需求的關係，需要以經緯度來轉換地址，幸好 Google map API 有提供 Geocoder 可以轉換大略地址的服務。

以前跟人家介紹 d3.js 的時候，我都會笑稱 d3.js 其實就是 SVG 界的 jQuery。 但是最近發現不少人對兩者的 select 以及 append 有些疑問，特別把它寫下來紀錄。

因為 Google Map 的 InfoWindow 是被新增出來的物件，所以我們可以透過修改 prototype 的方式，替 InfoWindow 增加新的 method。

  google.maps.InfoWindow.prototype.isOpen = function(){

一般來說有兩種處理方式：

直接把 DataURI 字串儲存起來，等要用的時候直接輸出至 <img> 的 src 屬性或是 CSS 中：

像這樣：

  <img src="<?php echo $base64_img_string; ?>" />