用 Google Chart 製作圖表和嵌入式地圖

之前研究加密貨幣錢包爬蟲的時候，發現原來 Google 有開放免費的圖表 API 供大家串接。使用方法也很簡單，依據需求填入資料即可。

不過它畢竟是 Google 提供的線上服務，沒人知道哪天會不會突然收回去、宣佈停止運作。因此流浪貓建議各位這種工具偶而使用即可，千萬別傻傻的全依賴它來建立重要的圖表資料。習翠習維尼

基本概念

要用 Google Chart API 繪製圖表，首先需具備以下三種參數：

cht: 圖表型態
chs: 圖表大小
chd: 數據參數

顏色 (chco) 與指定圖例 (chdl) 等參數則斟酌使用。

常用圖表類型

cht=bvg 長條圖
cht=lc 折線圖
cht=ls 走勢圖
cht=lxy 折線圖上產生點
cht=p 2D圓餅圖
cht=p3 3D圓餅圖
cht=pc 兩個資料序列的圓餅圖
cht=r 雷達圖
cht=s 散佈圖

繪製長條圖

cht=bvg
chs=300x200
chd=Data
chxt=x,y
chxl=資料名稱

https://chart.googleapis.com/chart?cht=bvg&chs=300x200&chd=t:50.8,28.7,25.6,24.3,23.9,22.5&chxt=x,y&chxl=0:|K'WA|Ubye|Wish|Nyoro|UsagiHime|Lilith

長條圖

繪製圓餅圖

https://chart.googleapis.com/chart?cht=pc&chs=300x200&chd=t:50.8,28.7,25.6,24.3,23.9,22.5&chxt=x,y&chxl=0:|K'WA|Ubye|Wish|Nyoro|UsagiHime|Lilith

圓餅圖 google chart

繪製 QRcode

cht=qr 
chs=300x300
chl=Data
choe=OUTPUT_ENCODING, 預設 UTF-8
https://chart.googleapis.com/chart?cht=qr&chs=500x500&chl=https://www.mrguarder.com

流浪貓的知識庫 QR Code

繪製 Google-O-meter 圖表

計量表或「撥號類型圖」是一種以背景顏色漸層和資料箭頭指標來表達數值大小的圖表形式。

cht=gom

https://chart.googleapis.com/chart?cht=gom&chs=300x200&chd=t:50.8,28.7&chxt=x,y&chxl=0:|K'WA|Ubye

google o meter

Developer Chart 計量表

繪製地圖圖表

雖然 Google map 有匯出與分享的功能，讓使用者能將目標位置內嵌在網站上，但如果你只是想簡單的呈現位置的話，可以用 Google Chart 來展示地圖。

基本參數

cht=map:fixed=<bottom_border_lat>,<left_border_long>,<top_border_lat>,<right_border_long>

cht=map:fixed=21,118,26,123  圖表縮放區域：緯度 21 到 26 度，經度 118 到 123 度
chld=TW-TPE|TW-TXG|TW-PIF
chm: 圖表標記
chma=10,10,10,10 加上 10px 的邊框
chtt=台灣地圖:新北、台中、屏東

https://chart.googleapis.com/chart?cht=map:fixed=21,118,26,123&chs=500x500&chld=TW-TPE|TW-TXG|TW-PIF&chco=B3BCC0|5781AE|FF0000|FFC726&chtt=台灣地圖:新北、台中、屏東&chma=10,10,10,10&chm=

chart map