通过简短的示例探索 p5.js 的可能性。
无替代文本
基本图形形状
绘制二维图形。
颜色
为你的绘图增添颜色。
绘制线条
用鼠标绘制线条
事件驱动的动画
暂停和恢复动画。
移动设备运动
根据设备运动进行动画。
条件
在你的绘图运行时，使用 if 和 else 语句来设置情境。
文本
加载字体并绘制文本。
复制图像数据
从图像文件中取色并绘制到画布上。
透明蒙版
使用一张图像来裁除另一张图像中的对应部分。
图像透明度
将画布上的一个图像设为半透明。
音频播放器
为一个音频文件创建播放器。
视频播放器
为一个视频文件创建播放器。
画布上的视频
在画布上显示并设置视频样式。
视频捕捉
显示来自摄像头的实时视频流。
图片拖放
显示页面访问者拖放的图像。
输入框和按钮
使用页面访问者的文本输入。
表单元素
创建表单并响应结果。
平移
移动坐标系的原点。
旋转
旋转坐标系。
缩放
修改坐标系的缩放比例。
线性插值
将 0 到 1 之间的数字转换到另一个范围。
映射
将一个范围内的数字转换到另一个范围。
随机
获取随机数字。
限制
保持数字在一个范围内。
时钟
获取当前时间。
颜色插值
在两种颜色之间渐变。
色轮
创建颜色光谱的可视化。
贝塞尔
绘制一组曲线。
万花筒
使用鼠标绘制镜像设计。
噪声
使用 Perlin 噪声生成自然纹理。
递归树
使用一个调用自身的函数绘制树。
随机诗歌
从一个词库中随机选择单词生成一首诗。
正弦与余弦
动画展示圆形、往复以及波浪运动。
瞄准
朝向一个点旋转。
三角带
将一个环分割成三角形。
圆圈点击器
制作一个关于快速点击圆圈并保存最高分的游戏。
乒乓球
制作一个受 Atari 的 Pong 启发的游戏。
贪吃蛇
制作一个基于贪吃蛇街机游戏的游戏。
几何
画 3D 形状，包括一个自定义模型。
自定义几何
编程生成一个 3D 形状。
材质
改变 3D 对象颜色、纹理及对光的响应方式。
轨道控制
用鼠标控制摄像机。
滤镜着色器
用着色器处理图像。
用着色器调整位置
使用着色器调整形状顶点。
帧缓冲区模糊
模拟相机的景深效果。
创建图形
在屏幕外绘制图像。
多画布
使用实例模式在页面上放置多个画布。
着色器作为纹理
使用着色器为 3D 形状生成纹理。
雪花
雪花动画。
晃动球弹跳
根据移动设备模拟球运动动画。
连接的粒子
使用鼠标绘制圆圈和连接线。
群集
模拟鸟群行为。
本地存储
在设备上保存来自浏览器的数据。
JSON
将数据存储在 JavaScript 对象表示法（JSON） 中。
表格
将数据存储为逗号分隔值（CSV）文件。
非正交性反射
模拟球在倾斜表面上弹跳。
软体
模拟软体加速向鼠标移动的物理效果。
力
模拟多个物体在液体中移动时受到的力。
烟雾粒子
使用粒子系统模拟烟雾。
生命游戏
重现 John Conway 的细胞自动机。
Mandelbrot 集
视化一个产生分形结构的数学集合。
