Canvas那些事儿

效果说明 本案例实现了一个动态的万花筒效果。通过Canvas绘制基础图形，结合旋转变换和对称复制，创建出绚丽的万花筒图案。效果包含颜色渐变、波浪动画和鼠标交互功能。

效果说明 本案例实现了一个图片像素跳动的动画效果。将图片分解成像素块，默认进行垂直运动，当鼠标悬浮时切换为水平运动，创造出独特的视觉效果。

详细讲解使用 Canvas 实现热力图的完整过程。从热力点模板的创建、透明度叠加原理到颜色映射处理，逐步展示了热力图的实现原理。通过结合实例代码，深入浅出地说明了如何将抽象的数据可视化为直观的热力图

效果说明 本案例实现了一个飘动的雪花背景效果。通过为每个雪花添加左右摆动的运动，模拟真实的雪花飘落效果。每个雪花都有独立的大小、速度和摆动幅度，营造出自然的视觉效果。

效果说明 本案例实现了一个鼠标点击时的粒子爆发效果。粒子会以点击位置为中心向四周散开，并受重力影响逐渐下落，同时颜色和透明度也会随时间变化。

如何使用 Canvas 创建一个彩虹渐变效果的文字。 1. 使用 `createLinearGradient` 创建线性渐变 2. 通过 `addColorStop` 设置渐变色标

效果说明 本案例实现了一个霓虹灯效果的文字动画。文字会产生发光效果，并且有轻微的闪烁变化，模拟真实霓虹灯的效果。

效果说明 本案例实现了一个圆形容器中的波浪加载动画效果。波浪会随着加载进度上升，并且不断波动，呈现出流动的效果。

效果说明 本案例实现了一个具有重力和弹性效果的小球动画。小球会在画布中弹跳，并受到重力影响，模拟真实的物理运动。

效果说明 本案例实现了一个简单的下雨动画效果。通过创建多个雨滴对象,模拟自然的降雨场景。每个雨滴都有独立的速度和长度,形成错落有致的视觉效果。

效果说明 本案例实现了一个磁力吸附的粒子效果。当鼠标靠近时，粒子会被吸引并跟随鼠标移动，离开后会缓慢返回原位，模拟磁场效果。

效果说明 本案例实现了一个类似《黑客帝国》中的数字雨效果。字符从屏幕顶部落下，形成连续的数字流，并添加了渐变和拖尾效果。

效果说明 本案例实现了一个文字粒子化的动画效果。将文字转换为由多个彩色粒子组成的形状，粒子会从随机位置移动到文字轮廓上，形成动态的组合效果。

拖尾效果的原理是在每一帧动画中，用一个半透明的黑色矩形覆盖整个画布。由于不是完全覆盖（透明度为0.1）， 之前帧绘制的内容会逐渐变暗但不会立即消失，从而形成渐变消失的拖尾效果。

效果说明 本案例实现了一个星空闪烁的动画效果。每颗星星都有独立的闪烁频率和亮度变化，营造出梦幻的星空效果。

效果说明 本案例实现了一个平滑的画笔跟随效果。鼠标或触摸移动时会生成一条彩色的轨迹，并添加了渐变色和渐隐效果。