矢量图像
由点、路径、曲线和填充等数学对象定义的数字图像。可缩放到任意大小而不损失质量。
矢量图像通过数学基元 - 点 (锚点)、线 (路径)、曲线 (贝塞尔曲线) 和填充来描述视觉内容,而非固定的像素网格。由于图像存储为一组绘图指令,可以缩放到任意大小而不退化。这使矢量图形成为 Logo、图标、字体和技术插图的首选格式。
- 分辨率无关性:矢量图像在渲染时根据输出设备的分辨率重新计算。单个 SVG 文件在手机屏幕和广告牌尺寸的印刷品上同样适用
- 文件大小特征:简单几何形状产生的文件极其紧凑。然而,包含数千条路径和复杂渐变的高度详细插图可能导致较大的文件大小
- 主要格式:
SVG(可缩放矢量图形) 是 Web 标准。印刷工作流程依赖 AI (Adobe Illustrator)、EPS 和 PDF 格式
在 Web 开发中,SVG 可内联嵌入 HTML,支持对各个元素进行 CSS 样式设置和 JavaScript 驱动的动画。<svg> 容器内的 <path>、<circle> 和 <rect> 等元素可通过 DOM 独立寻址,使 SVG 成为交互式数据可视化、图标系统和动画 UI 组件的理想选择。D3.js 和 Snap.svg 等工具广泛利用了这一能力。