Representing graphics

学习笔记：图形表示 (3.5.5)

欢迎来到数字图像的世界！如果你曾好奇电脑或手机是如何存储照片或商标的，这一章将为你揭晓答案。我们将探索计算机将可见图像转化为简单的二进制数据（0 和 1）的两种主要方式。
对于从事数字媒体、编程，或者仅仅是想为自己的作品选择正确文件格式的同学来说，理解这些内容至关重要！

3.5.5.1 位图图形 (光栅图像)

位图图形是表示照片等复杂、逼真图像最常用的方式。你可以把位图想象成一个巨大的马赛克或铺满瓷砖的地板。

位图如何表示图像：

位图是由一个个被称为像素 (pixels，即 picture elements 的缩写) 的网格组成的。计算机逐行存储网格中每个像素的颜色信息。

位图的关键概念

1. 像素尺寸 (分辨率)

位图的尺寸或称分辨率，是用它的宽度（像素数）乘以高度（像素数）来衡量的。
示例：一张宽 1920 像素、高 1080 像素的图像，通常记作 1920 x 1080 像素。

2. 颜色深度

颜色深度是用于表示单个像素颜色的位数 (bits)。
每个像素使用的位数越多，图像能显示的颜色就越丰富，画面也就越真实、细腻。

记忆小贴士：如果使用 \(n\) 位作为颜色深度，可以表示 \(2^n\) 种不同的颜色。

• 1 位（单色）：\(2^1 = 2\) 种颜色（通常为黑白）。
• 8 位：\(2^8 = 256\) 种颜色。
• 24 位（真彩色）：\(2^{24} \approx 1670\) 万种颜色（高质量照片的标准）。

计算存储需求（不含元数据）

要计算未压缩位图的存储大小，你需要知道图像的总像素数以及每个像素所需的位数。

存储公式（单位为 bit）：

$$ \text{存储需求} = \text{宽度（像素）} \times \text{高度（像素）} \times \text{颜色深度（bit）} $$

分步计算示例：

假设有一张宽 100 像素、高 50 像素的小图，颜色深度为 8 位。

1. 计算总像素数（尺寸）：
   $$ 100 \times 50 = 5000 \text{ 像素} $$
2. 计算总存储量（bit）：
   $$ 5000 \text{ 像素} \times 8 \text{ bit/像素} = 40,000 \text{ bit} $$
3. （可选，但常用）转换为字节（因为 1 Byte = 8 bit）：
   $$ 40,000 \text{ bit} / 8 = 5000 \text{ Bytes} $$

你知道吗？这个计算得出的是原始图像的大小。真实的图像文件（如 JPG 或 PNG）由于使用了压缩技术，通常会小得多！

元数据 (Metadata)

图像文件中还包含元数据。元数据是“关于数据的数据”。它存储了计算机正确打开和显示图像所需的关键信息，但这些信息本身不属于颜色数据的一部分。

位图元数据的典型例子包括：

• 图像的宽度（像素数）。
• 图像的高度（像素数）。
• 颜色深度（bit）。

3.5.5.2 矢量图形 (Vector Graphics)

矢量图形则采用了完全不同的方法。它们不是存储每个微小点的颜色数据，而是将图像存储为一系列绘制形状的数学指令。

矢量如何表示图像：

矢量图像使用对象列表（或几何形状）来表示图像。当你打开矢量文件时，计算机读取这些指令并在屏幕上绘制出这些形状。

类比：位图就像一张完成的照片；而矢量图就像一套施工说明或数学蓝图。

对象的典型属性（绘图指令）

列表中的每个几何对象都存储了相关属性。这些属性精确规定了对象应如何绘制。常见属性包括：

• 位置：对象开始处的 x 和 y 坐标（例如，左上角或中心点）。
• 轮廓颜色：对象边框或线条的颜色。
• 线条宽度：对象轮廓的粗细。
• 填充颜色：用于填充形状封闭区域的颜色。

对于一个圆，列表中可能包含圆心的位置、半径和颜色属性。对于一条线，它可能存储起点、终点和线条宽度。

3.5.5.3 位图与矢量图形的比较

这两种方法各有优缺点，适用于不同的任务。你必须能够比较它们的优势和劣势，特别是关于色彩范围和可缩放性方面。

比较：优缺点

特性	位图图形	矢量图形
逼真度与细节	极佳。能捕捉复杂的照片和细腻的颜色渐变（因为存储了每个像素的颜色）。	不适合处理复杂照片。最适合表现锐利的线条和色彩分明的色块。
可缩放性 (重置大小)	较差。如果你放大位图，像素会被拉伸，导致图像变得模糊或出现“马赛克”。	极佳。图像会根据数学指令重新计算，因此无论大小如何，始终保持完美清晰。
文件大小	通常非常大，尤其是高分辨率和高颜色深度的图像。	通常较小，因为只存储了形状的属性（指令），而非每个像素。
编辑	难以编辑单个形状。编辑通常涉及直接修改像素颜色。	易于编辑。你可以移动、调整大小或更改单个对象的颜色，而不会影响其他对象。

应用场景

选择合适的格式完全取决于图像的类型。

何时使用位图（例如：JPG, PNG, GIF 格式）：

• 照片：需要微妙的色彩变化和逼真的细节。
• 复杂艺术/扫描图像：任何需要大量颜色范围和高度还原原稿的图像。
• 应避免的常见错误：如果商标需要以不同尺寸打印，千万不要使用位图，否则放大时会模糊不清！

何时使用矢量图（例如：SVG, AI, EPS 格式）：

• 商标与品牌设计：因为它们无论是在名片上还是巨大的广告牌上，都必须看起来完美且平滑。
• 技术绘图与插图：由精确线条和形状定义的图像（如平面图、地图或简单的图表）。
• 字体 (字形)：字体中的字符都是通过数学方式定义的，因此可以平滑缩放。