# 🏅 Day 34 - C3.js 使用練習

練習使用 [C3.js](https://c3js.org/gettingstarted.html) 這個套件！

> 記得載入 CDN
> C3.js
> - CSS `https://cdnjs.cloudflare.com/ajax/libs/c3/0.7.20/c3.min.css`
> - JS `https://cdnjs.cloudflare.com/ajax/libs/c3/0.7.20/c3.min.js`
>
> D3.js `https://cdnjs.cloudflare.com/ajax/libs/d3/5.16.0/d3.min.js`（v5 版本）
>
> 簡易範例：https://codepen.io/hexschool/pen/WNyGYbw?editors=1010

問題一
---
老媽希望了解一下她的兩個兒子，大翰跟小寶，每天在學校的數學小考成績狀況如何。她透過 C3.js 的 [折線圖](https://c3js.org/samples/timeseries.html) 將他們兩個的 成績數據 圖像化，已經知道圖像化後的結果如下圖：


請問 JS 程式碼應該如何撰寫？

> 成績數據
>
> 
>
> 可以參考：https://c3js.org/samples/timeseries.html

問題二
---
六角高中準備舉辦園遊會，要由同學們票選出這次的主題。班長透過 C3.js 的 [Donut Chart](https://c3js.org/samples/chart_donut.html) 將投票數據呈現如下：


已經知道主題有三種，它們各自的得票數以及色碼資訊為：

| 主題 | 得票數 | 色碼 |
|:----------:|:------:|:-------:|
| 鬼屋 | 10 | #E68618 |
| 女僕咖啡廳 | 20 | #F280CA |
| 童話世界 | 5 | #26BFC7 |

請問 JS 程式碼應該如何撰寫？

## 回報流程

將答案寫在 CodePen 並複製 CodePen 連結貼至底下回報就算完成了喔!
解答位置請參考下圖（需打開程式碼的部分觀看）


<!-- 解答：

https://codepen.io/hexschool/pen/MWXKoGd?editors=1010
-->

回報區
---
| # | Discord | CodePen / 答案 |
| --- | ----- | ----- |
| 01 | voke | [CodePen](https://codepen.io/FiSi-the-lessful/pen/bGXvZwG) |
| 02 | Hedwig | [CodePen](https://codepen.io/adirehfz-the-encoder/pen/poMYJgX?editors=1010) |
| 03 | 毛巾 | [CodePen](https://codepen.io/bqdcjboa-the-solid/pen/RwXdPRQ) |
| 04 | 泊岸 | [CodePen](https://codepen.io/qoq77416416/pen/YzmgXre?editors=0010) |
| 05 | tim | [CodePen](https://codepen.io/jskrtivy-the-animator/pen/YzmgXdj?editors=1010) |
| 06 | 睿睿 | [CodePen](https://codepen.io/uwmrsusb-the-solid/pen/yLmwNEY?editors=0011) |
| 07 | yuyuhunter_0509 | [CodePen](https://codepen.io/KRcube/pen/gOVEaaN?editors=1010) |
| 08 | .tsz_ying | [CodePen](https://codepen.io/bekgnohe-the-selector/pen/XWvGmpV?editors=1010) |
| 09 | david1819 | [CodePen](https://codepen.io/David-Lin-the-vuer/pen/zYgbvzW) |
| 10 | Dolce_墨 | [CodePen](https://codesandbox.io/p/sandbox/nifty-chaplygin-5mcswq) |
| 11 | 610 | [CodePen](https://codepen.io/YI-LING-LIU/pen/bGXZeQB) |
| 12 | Kaya | [CodePen](https://codepen.io/kayaribi/pen/ZEgPBeY) |
| 13 |mercury2508.| [CodePen](https://codepen.io/Mercury2508/pen/eYqXzgE) |
| 14 | Ariel | [CodePen](https://codepen.io/ariel0510/pen/qBevjLg) |
| 15 | Sonia | [CodePen](https://codepen.io/YUJOU/pen/BaXbmeL) |
| 16 | yuyeh_1212 | [CodePen](https://codepen.io/yuyeh1212/pen/BaXbVwq) |
| 17 | Tatsu | [CodePen](https://codepen.io/chindesu0207/pen/JjgzBPO) |
| 18 | JIA | [CodePen](https://codepen.io/nzaicwlw-the-styleful/pen/GRVLREL?editors=0010) |
| 19 | Mike | [CodePen](https://codepen.io/mike2049/pen/rNXbMVv?editors=1011) |
| 20 | joylu0902 | [CodePen](https://codepen.io/joylu0902/pen/qBewbvd) |
| 21 | 嚼勁先生 | [CodePen](https://codepen.io/James520284/pen/zYgXROV) |
| 22 | 是在哈囉 | [CodePen](https://codepen.io/miyxdhem-the-solid/pen/PoMgQOR?editors=1010) |
| 23 | Mos | [CodePen](https://codepen.io/mos25399/pen/LYwvBNe?editors=1010) |
| 24 | jerry_66983 | [CodePen](https://codepen.io/Barry-C/pen/PoMgRrw) |
|25|Hailey|[CodePen](https://codepen.io/sxbokfja-the-flexboxer/pen/qBewwPw?editors=1010)|
| 26 | Chun | [CodePen](https://codepen.io/Chun_debbie/pen/zYgXQjG?editors=1010) |
| 27 | Rogan | [CodePen](https://codepen.io/RoganHsu/pen/qBeGKga?editors=1010) |
| 28 | ycl325.etheddie | [CodePen](https://codepen.io/wdvikfuz-the-selector/pen/ZEgdpzL) |
| 29 | Joannehu | [CodePen](https://codepen.io/nelbabkv-the-flexboxer/pen/qBeGYLG) |
| 30 | Lotte | [CodePen](https://codepen.io/hmkdoxuj-the-decoder/pen/yLmdgEN?editors=1010) |
| 31 | 陳小廷 | [CodePen](https://codepen.io/ting1124/pen/QWeXQzB) |
| 32 | JRz | [CodePen](https://codepen.io/JRZHENG/pen/BaXXKaz) |
| 33 | ab567ab5 | [CodePen](https://codepen.io/WanTzu-Chiang/pen/eYqqzOa?editors=1010) |
| 34 | Nocab | [CodePen](https://codepen.io/PeihanWang/pen/eYqqqQR?editors=1010) |
| 35 | chris | [CodePen](https://codepen.io/chris-chenthe-selector/pen/gOVEPZX) |
| 36 | 蘑菇星星 | [CodePen](https://codepen.io/brrrieon-the-vuer/pen/QwLLpaw?editors=1111) |
| 37 | Ana | [Codepen](https://codepen.io/Ana-Wu/pen/XJrremV)|
| 38 | Jack | [Codepen](https://codepen.io/kxbhixte-the-sasster/pen/dPbbmpG?editors=1010)|
| 39 | Seris | [Codepen](https://codepen.io/Dale-Chien/pen/jENNQOZ)|
| 40 | jimmy.0706 | [Codepen](https://codepen.io/JimmyMao/pen/dPbbdow?editors=1010)|
| 41 | Emma | [CodePen](https://codepen.io/Emma0919/pen/OPLJWmg) |
| 42 | charlottelee | [CodePen](https://codepen.io/char849/pen/wBwvbdv) |
| 43 | kaka_945 | [CodePen](https://codepen.io/kay945/pen/qEWBegX) |
| 44 | KOMATSU PEI | [CodePen](https://codepen.io/Komatsu2021/pen/MYgWNvg?editors=1011) |
| 45 | alec1203 | [CodePen](https://codepen.io/soloayaya/pen/RwXXKZj?editors=1111) |
| 46 | 雪粒 | [CodePen](https://codepen.io/bzykdfhw-the-bashful/pen/ZYzYwxe) |
| 47 | Chuang | [CodePen](https://codepen.io/uidoytjq-the-solid/pen/wBwVYPE?editors=1010) |

<!-- 可複製下方格式
| | | [CodePen]() |
-->