UD5工具箱
专业术语与技术概念
SVG（可缩放矢量图形）
SVG 是 Scalable Vector Graphics 的缩写，即可缩放矢量图形。它是一种基于 XML 的开放标准二维矢量图形格式，由 W3C（万维网联盟）制定和维护。与 JPEG、PNG 等位图格式不同，SVG 使用数学方程来描述图形的形状和颜色，因此可以在任意缩放比例下保持清晰锐利的显示效果。SVG 广泛应用于网页图标、数据可视化图表、地图、插画和动画等场景。
SMIL（同步多媒体集成语言）
SMIL 是 Synchronized Multimedia Integration Language 的缩写，即同步多媒体集成语言。它是 W3C 制定的一种基于 XML 的多媒体描述语言，用于控制多媒体内容的播放时序和交互行为。在 SVG 动画中，SMIL 允许开发者定义元素属性随时间变化的动画效果，包括动画的开始时间、持续时间、重复次数、缓动函数等参数。SMIL 是 SVG 动画的原生解决方案。
矩形元素（rect）
矩形是 SVG 中最常用的基础图形元素之一。在 SVG 代码中使用 rect 标签创建。矩形的主要属性包括 x（左上角 X 坐标）、y（左上角 Y 坐标）、width（宽度）、height（高度）和 rx/ry（圆角半径）。通过设置不同的 rx 和 ry 值，可以创建从直角矩形到圆角矩形的各种变体。
圆形元素（circle）
圆形是 SVG 中用于绘制正圆的图形元素。使用 circle 标签创建，主要属性包括 cx（圆心 X 坐标）、cy（圆心 Y 坐标）和 r（半径）。圆形元素适用于创建按钮、标记点、装饰图案等需要正圆形状的场景。
椭圆元素（ellipse）
椭圆是圆形的推广形式，可以绘制横向或纵向拉伸的椭圆形。使用 ellipse 标签创建，主要属性包括 cx（椭圆中心 X 坐标）、cy（椭圆中心 Y 坐标）、rx（水平半径）和 ry（垂直半径）。当 rx 等于 ry 时，椭圆退化为正圆。
线条元素（line）
线条是 SVG 中用于绘制直线段的图形元素。使用 line 标签创建，主要属性包括 x1（起点 X 坐标）、y1（起点 Y 坐标）、x2（终点 X 坐标）、y2（终点 Y 坐标）和 stroke（描边颜色）。线条元素适用于创建分割线、连接线和简单的几何图形。
文字元素（text）
文字元素是 SVG 中用于显示文本内容的元素。使用 text 标签创建，主要属性包括 x 和 y（文字定位坐标）、font-family（字体）、font-size（字号）和 fill（文字颜色）。文字元素支持文本内容的直接显示，适合创建标签、标题和装饰性文字。
路径元素（path）
路径是 SVG 中最强大和灵活的图形元素。使用 path 标签创建，通过 d 属性定义的路径数据描述复杂的形状。路径数据由移动（M）、直线（L）、曲线（C/Q）、弧线（A）、闭合（Z）等命令组合而成，可以绘制几乎任何二维形状。路径元素是创建复杂矢量图形的核心工具。
动画预设（Animation Preset）
动画预设是 SVG 动画合成器中预先定义好的动画效果模板。每种预设对应一组特定的动画参数配置。常用的预设包括弹跳（bounce）效果使元素在运动后回弹，脉冲（pulse）效果使元素周期性缩放，摇摆（swing）效果使元素在角度范围内来回摆动，淡入（fade-in）效果使元素从透明渐变为不透明，颜色变换（color-shift）效果使元素颜色在指定范围内平滑过渡。
缓动函数（Easing Function）
缓动函数定义了动画速度随时间变化的曲线。线性缓动表示匀速运动，ease-in 表示先慢后快，ease-out 表示先快后慢，ease-in-out 表示两端慢中间快。不同的缓动函数可以产生不同的运动感觉，是控制动画质感的重要参数。
Z-index（层叠顺序）
Z-index 是控制元素在垂直方向上叠放顺序的属性。数值越大的元素越显示在上层。在 SVG 动画合成器中，元素的叠放顺序由添加顺序决定，后添加的元素默认显示在上层。通过元素列表面板可以调整元素的叠放顺序。
响应式 SVG（Responsive SVG）
响应式 SVG 是指能够自适应不同屏幕尺寸和容器大小的 SVG 图形。由于 SVG 使用矢量描述而非固定像素，它天然具备响应式特性。在不同分辨率的设备上，SVG 都能保持清晰的显示效果，非常适合现代响应式网页设计。