記錄一下:
App Inventor學習記錄190-支援折線圖等 5種圖表的外掛~ChartMakerPlus
這次的範例,我照著外掛上的教學就已經很吃力的,所以有做錯或是說錯的部份,請大家包涵。
完成品如下。
按下按鈕之後,可以切換 5種不同的支援的圖片。
這個的圖表是用 google chart做的,所以沒有網路的時候應該是不能用的。
想到沒網路就不能用這個問題,本來就想跳過這個外掛,但真的太值得介紹。
畫面編排的部份如下。
這裡的圖片主要會顯示在 webviewer元件上,所以一定要拉一個進來。
pie chart,圓餅圖的型式如下。
pie chart,圓餅圖,它的程式方塊是這樣子的。
請大家參考著看,我也不是很了解,我目前就是照著做一份,然後試著去改他的參數看看會有什麼效果出現。
更多pie chart,圓餅圖參數參考如下:
https://developers.google.com/chart/interactive/docs/gallery/piechart#configuration-options
bar chart,條狀圖如下,它是動態的,這個好酷。
bar chart,條狀圖的程式方塊如下。
更多 bar chart,條狀圖參數參考如下:
https://developers.google.com/chart/interactive/docs/gallery/barchart#configuration-options
table chart,表格圖如下。
table chart,表格圖的程式方塊如下。
更多 table chart,表格圖參數參考如下:
https://developers.google.com/chart/interactive/docs/gallery/table#configuration-options
column chart,柱狀圖如下。
column chart,柱狀圖的程式方塊如下。
更多 column chart,柱狀圖參數參考如下:
https://developers.google.com/chart/interactive/docs/gallery/columnchart#configuration-options
line chart,折線圖如下。
line chart,折線圖的程式方塊如下。
更多 line chart,折線圖參數參考如下:
https://developers.google.com/chart/interactive/docs/gallery/columnchart#configuration-options
好的,全部的程式方塊都簡單說明過了,建議大家試著做一次,就會用的越來越熟。
但如果不想要重新拉程式方塊,或要需要範例 aia檔的話,請前往第 2頁哦!