Canvas 画板

课程目标

通过用 Canvas 写一个简易画图工具,学习掌握 Canvas 画图基础知识。

阅读

• MDN Canvas 学习指南 (opens new window)
• HTML5 Canvas 教程 (opens new window)

编码

参考示例图 (opens new window),现在我们来实现一个简易绘画板，具体功能要求如下

• 提供一个 input 选择画布背景颜色
• 提供一个 input 选择笔触颜色
• 提供一个 input 设置画笔粗细
• 点击清空按钮，完成画布的清空
• 点击保存图像按钮，实现画布保存为图像并且实现下载
• 点击展示画图路径按钮，可以将画画的过程重新展示出来,效果参考动态示例 (opens new window)

进阶任务

如果你很快就完成上面的任务，可以去 LeetCode 上去多进行一些练习。

提交

把你今天觉得做得最好的代码放在 Github 后进行提交。

总结

依然把今天的学习用时，收获，问题进行记录。