UD5工具箱
绘图术语表
Canvas（画布）
HTML5标准提供的浏览器原生图形绘制接口，允许通过JavaScript在网页上进行像素级的图形操作。Canvas元素在网页上创建一块矩形区域，开发者可以通过Canvas API在该区域上绘制线条、形状、图片和其他视觉内容。在在线绘图板中，Canvas作为核心绘图区域，承载所有的绘画操作和渲染结果。所有绘制内容均在浏览器本地完成，无需服务器参与。
像素（Pixel）
像素是数字图像中最小的基本组成单位，全称为「图像元素」（Picture Element）。每个像素代表画布上的一个点，包含颜色和位置信息。在在线绘图板中，画笔大小以像素为单位计量，画笔大小为1像素时画出最细的线条，50像素时画出最粗的线条。屏幕上显示的图片本质上都是由大量像素按行列排列组成的像素矩阵。
涂鸦（Doodle）
指随性、自由的绘画创作方式，通常不受严格的绘画规则和技法约束。涂鸦强调即兴创作和情感表达，可以使用各种颜色和线条形式。在线绘图板的核心定位就是一个轻量级的涂鸦工具，让用户可以随时随地打开浏览器进行自由创作，不需要专业绑画技能。
画笔（Brush/Pen）
在线绘图板中的基本绘画工具，模拟现实中的画笔或铅笔。画笔在画布上移动时会沿着移动轨迹绘制连续的线条，线条的颜色和粗细由用户设置的颜色和画笔大小参数决定。画笔的渲染原理是在鼠标或触摸移动过程中，将当前位置与上一个位置之间用指定宽度的线段连接起来，形成平滑的连续线条。
橡皮擦（Eraser）
用于擦除画布上已有绘画内容的工具。在本工具中，橡皮擦以白色（与画布背景色一致）覆盖原有绘画内容来实现擦除效果。橡皮擦的大小同样受画笔大小滑块控制，可以调节粗细以适应不同的擦除精度需求。橡皮擦操作在本质上与画笔相同，只是颜色固定为画布背景色。
撤销/重做（Undo/Redo）
撤销是指将画布状态回退到之前某一步的操作，用于撤销最近的绘画操作。重做是指恢复被撤销的操作。在线绘图板通过维护一个历史状态数组来实现撤销重做功能，每完成一笔绘画就将当前Canvas的图像数据保存到数组中。支持最多20步撤销，超过后最早的历史记录会被自动清除以释放内存。这是一个在各类编辑软件中都常见的核心功能。
touch-action
CSS属性，用于控制元素在触摸设备上的默认行为。设置touch-action:none可以禁止浏览器对元素的所有默认触摸处理，包括页面滚动、缩放、惯性滚动等。在线绘图板在Canvas元素上设置此属性，确保用户的触摸操作全部用于绘画，不会意外触发页面滚动或缩放，从而提供流畅的移动端绘画体验。
PNG（Portable Network Graphics）
一种无损压缩的位图图片格式，是目前互联网上最常用的图片格式之一。PNG格式支持Alpha通道透明度，采用DEFLATE无损压缩算法，不会像JPEG格式那样在压缩时丢失图片质量。在线绘图板使用PNG格式导出绘画作品，能够完整保留画布上的所有颜色和细节信息，确保下载的图片与画布上的显示效果完全一致。
事件监听（Event Listener）
JavaScript中用于响应用户交互操作的机制。通过在DOM元素上注册事件监听器，可以在特定事件发生时执行相应的回调函数。在线绘图板在Canvas元素上注册了多种事件监听器，包括鼠标按下（mousedown）、鼠标移动（mousemove）、鼠标抬起（mouseup）以及对应的触摸事件（touchstart、touchmove、touchend），用于实时捕获用户的绘画操作并进行渲染。