Canvas的绘图过程

获取Canvas元素的上下文：通过JavaScript代码使用getContext方法获取一个绘图上下文，其中最常用的是2D绘图上下文，可以通过canvas.getContext('2d')来获取。

设置绘图样式：通过设置上下文的属性（例如fillStyle和strokeStyle）来指定绘图操作的填充和描边样式，包括颜色、渐变、图案等。

绘制路径或形状：使用上下文提供的方法（例如beginPath、moveTo、lineTo、arc等）来创建路径或定义形状。

应用填充和描边：根据需要，可以使用上下文的方法（例如fill和stroke）来填充路径内部或绘制路径的外边框。

绘制文本和图像：除了路径和形状，Canvas还提供了绘制文本和图像的方法，可以在画布上显示文本和图像。

处理动画和交互：Canvas还可以用来创建交互式的动画效果。通过在每一帧之间更新画布内容，并结合用户输入或计时器来实现动画效果。

https://www.nowcoder.com/issue/tutorial?zhuanlanId=Mg58Em&uuid=4f02b91eaabc478690b131e28c8b989b