---
# System prepended metadata

title: "\U0001F3C5 3/30 (二) 每日任務"
tags: [JS 直播班 - 2021 春季班]

---

# 🏅 3/30 (二) 每日任務
###### tags: `JS 直播班 - 2021 春季班`

C3.js 使用練習
---
請同學觀看完 [第七週錄影](https://courses.hexschool.com/courses/1289881/lectures/31348356) 後，練習使用 C3.js 這個套件!


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

![](https://i.imgur.com/uwET4hP.png)

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

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

![](https://i.imgur.com/Tj3YK52.png)

已經知道主題有三種，它們各自的得票數以及色碼資訊為:
```
鬼屋{
    得票數: 10,
    色碼: #E68618
}
女僕咖啡廳{
    得票數: 20,
    色碼: #F280CA
}
童話世界{
    得票數: 5,
    色碼: #26BFC7
}
```
請問 JS 程式碼應該如何撰寫? 


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

![](https://i.imgur.com/6UoJVtD.png)

<!-- 解答
https://codepen.io/znlcgmgk/pen/RwKaOgL?editors=1010
-->