[App Inventor 教學] WebViewer 元件結合Google Chart – Barchart 長條圖與文氏圖

Google Chart 文件說明:https://developers.google.com/chart/image/docs/chart_playground?hl=zh-TW

Image Chart Editor:http://imagecharteditor.appspot.com/

這張圖的語法是:

http://chart.googleapis.com/chart?cht=bvg&chs=320×300&chd=t:10,40,60,80,30,20&chf=b0,lg,0,FFE7C6,0,76A4FB,1&chxt=x,y&chxs=0,ff0000,12,0,lt|1,0000ff,10,1,lt

一樣來逐個擊破吧!

&cht=bvg   圖表類型為 bvg

&chs=320×300   圖表尺寸,此處建議與WebViewer尺寸相同

&chd=t:10,40,60,80,30,20   資料內容為:(10,40,60,80,30,20)等六筆資料

&chf=b0,lg,0,FFE7C6,0,76A4FB,1   漸層,由 FFE7C6 逐漸變化到 76A4FB

&chxt=x,y  軸向

&chxs=0,ff0000,12,0,lt|1,0000ff,10,1,lt  軸標籤類型

================================================

來另一張交集圖,語法如下:

http://chart.googleapis.com/chart?chs=320×300&cht=v&chco=FF6342,ADDE63,63C6DE&chd=t:100,80,60,30,30,30,10&chdl=A|B|C

&cht=v   圖表類型

&chs=320×300

&chco=FF6342,ADDE63,63C6DE   三個圖塊的顏色

&chd=t:100,80,60,30,30,30,10    A, B, C尺寸為(100,80,60),AB交集30, AC交集30, BC交集10

&chdl=A|B|C   標籤文字為A,B,C

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *