计算机图形学完整笔记（五）：二维图形变换

第五章 二维图形变换

5.1 向量基础

• 向量功能

  • 图形学中，处理三维物体，以及绘制对象的形状、位置、方向。有两大基本工具：向量分析、图形变换。

  • 向量：点和方向的实体 (没有位置)

• 向量的表示

  • 两点之差是一个向量，方向指向被减点。$v=Q-P$

  • $n$ 维向量就是一个 $n$ 元组

    • $w=(w_1,w_2,…,w_n)$，$w=\left[ \begin{matrix} w_1\ w_2\ w_3\end{matrix} \right]$

• 向量基本运算

  • 加减、数乘

  • 归一化

    • 即将向量转变为单位向量，方向不变，长度 $=1$

  • 点积

    • $a = (a_1, a_2)，b=(b_1,b_2) $

    • $a · b = a_1b_1+a_2b_2 = |a||b|cos\langle a,b\rangle$，用向量描述新闻，新闻相似，则向量夹角余弦接近于 1

    • $a·b>0,\theta <90°$ ; $a·b=0,\theta =90°$ ; $a·b<0,\theta >90°$ ;

  • 叉积

    • $a=(a_x,a_y,a_z)，b=(b_x,b_y,b_z)，a \times b = \begin{vmatrix} i & j & k \\ a_x & a_y & a_z \\ b_x & b_y & b_z \end{vmatrix}=|a||b|sin\langle a,b\rangle$

    • $a\times b$ 和 $a$、$b$ 两个向量都正交，因此可以利用叉积求平面的法向量

    • $a\times b$ 的长度等于由 $a$ 和 $b$ 决定的平行四边形面积

• 向量线性组合

  • 向量两种特殊线性组合（$w = a_1v_1 + a_2v_2+…+a_nv_n$）：

    • 仿射组合：线性组合的系数和等于 1，$\sum\limits_{i=1}^n a_i = 1$

    • 凸组合：线性组合的系数和等于 1，且各系数非负，$\sum\limits_{i=1}^n a_i = 1\ (a_i \ge 0)$

5.2 图形坐标系

• 坐标系的基本概念

  • 坐标系：建立图形和数之间对应联系的参考系

  • 建模 (modeling)：程序中用于描述对象几何信息的数值

  • 观察 (viewing)：表示对象中大小和位置的数值

    • 二维观察变换的一般方法是在世界坐标系中指定一个观察坐标系统，以该系统为参考通过选定方向和位置来指定矩形裁剪窗口。

• 坐标系分类

  • 维度分类

    • 一维、二维、三维坐标系

  • 坐标轴之间的空间关系分类

    • 直角坐标系、极坐标系、圆柱坐标系、球坐标系

  • 计算机图形学坐标系分类

    • 世界坐标系：

      公共坐标系，现实中物体或场景的统一参照系。计算机图形系统中涉及的其它坐标系都是参照它进行定义的。

    • 建模坐标系：

      又称局部坐标系，每个物体(对象)有它自己的局部中心和坐标系，独立于世界坐标系来定义物体的几何特性。

    • 观察坐标系：

      依据观察窗口的方向和形状在世界坐标系中定义的坐标系。观察坐标系用于指定图形的输出范围。

    • 设备坐标系：

      适合特定输出设备输出对象的坐标系，比如屏幕坐标系。设备坐标是整数。

    • 规范化坐标系：

      规范化坐标系独立于设备，能容易地转变为设备坐标系，是一个中间坐标系。归一化后的坐标，坐标轴取值范围 0~1。

5.3 二维图形变换原理

5.3.1 图形变换概述

• 用途

  • 各种变换：比例、旋转、镜像、错切、平移

  • 由一个基本的图案，经过变换组合成另外一个复杂图形

  • 用很少的物体组成一个场景

  • 可以通过图形变换组合得到动画效果

• 基本原理

  • 图形变化，但原图形的连边规则没有改变

  • 图形变化，是因为顶点位置改变决定

  • 变换几何关系，保持原拓扑关系。

5.3.2 仿射变换

• 仿射变换 (Affine Transformation / Affine Map)

  • 基本功能

    • 平直性

      ：直线变换后仍是直线

    • 平行性

      ：平行线变换后仍平行，且直线上点的位置顺序不变

  • 二维仿射变换

    • $x’$ 和 $y’$ 都是原始坐标 $x$ 和 $y$ 的线性函数

    • $\begin{cases} x’ = a_1x+b_1y+c_1 \ y’=a_2x+b_2y+c_2 \end{cases}$

    • 矩阵形式：$\left[ \begin{matrix} x^* & y^* \end{matrix}\right] =\left[ \begin{matrix} x & y & 1 \end{matrix}\right]· \left[ \begin{matrix} a_1 & a_2\ b_1 & b_2 \ c_1 & c_2 \end{matrix} \right]$

5.3.3 齐次坐标

• 二维平面中用 $(x, y)$ 表示一个点，不妨说是一个向量 $(x, y)$ 表示一个点。所以可以用第 $3$ 维为常数的 $(x, y, 1)$ 表示二维平面上的向量。

• 这种 $n+1$ 维表示 $n$ 维的方法称为——齐次坐标表示法，$n$ 维向量 $(p_1,p_2,\cdots,p_n)$ 表示为 $(hp_1,hp_2,\cdots,hp_n, h)$，其中 $h $ 称为哑坐标，特别的 $h=1$ 时称齐次坐标为规格化坐标。

• 二维仿射变换，齐次坐标表示：$\left[ \begin{matrix} x^* & y^*&1 \end{matrix}\right] =\left[ \begin{matrix} x & y & 1 \end{matrix}\right]· \left[ \begin{matrix} a_1 & a_2 &0\ b_1 & b_2&0 \ c_1 & c_2 &1\end{matrix} \right]$

• 不使用齐次坐标可以做比例、对称、旋转变换，但做不到平移变化，无法增加常数项。

5.4 基本几何变换

5.4.1 平移变换

• 不产生变形而移动物体的刚体变换，即物体上的每个点移动相同数量的坐标

• 坐标形式：

• 齐次坐标形式：

5.4.2 比例变换

• 相对于坐标原点沿 $x$ 方向放缩 $S_x$ 倍，沿 $y$ 方向放缩 $S_y$ 倍。$S > 1$ 放大，$S < 1$ 缩小。

• 坐标形式：

• 齐次坐标形式：

• 当 $S_x =S_y$ 时，为整体比例变换，

$S>1$ 放大，$0<S<1$ 缩小，$S<0$ 发生关于原点的对称等比变换。

5.4.3 对称变换

• 也称镜像变换或反射变换。有关于x轴、y轴、原点、某条直线的对称变换。

• 关于 $x$ 轴对称：

• 关于 $y$ 轴对称：

• 关于原点对称：

5.4.4 旋转变换

• 将点绕原点旋转角度 $\theta$ ，逆时针为正，顺时针为负

• 坐标形式（逆时针）：

• 齐次坐标形式（逆时针）：

• 顺时针只要将 $\theta = -\theta$ 即可。

5.4.5 错切变换

• 弹性物体的变形处理

• 变换矩阵中的非对角线元素大都为零，若变换矩阵中的非对角元素不为 $0$，则意味着 $x$、$y$ 同时对图形的变换起作用。也就是说，变换矩阵中非对角线元素起着把图形沿 $x$ 或 $y$ 方向错切的作用。

• $x$ 值或 $y$ 值越小，错切量越小；$x$ 值或 $y$ 值越大，错切量越大。

• 齐次坐标形式：

• 沿 $x$ 方向错切，即 $b=0$ ：

5.4.5 复合变换

• 图形作大于一次的变换，$P^* = P · T = P·(T_1·T_2·\cdots ·T_n) ，n\gt 1$，矩阵相乘不可交换！任何一个复杂的几何变换都可以看作基本几何变换的组合形式。

• 二维复合平移：

• 二维复合比例：

• 二维复合旋转：

5.4.6 坐标系变换

• 图形变换经常需要从一个坐标系变换到另一个坐标系，如下图从 $x0y$ 变换到 $x’0’y’$

• 上图变换分两步完成，$x’0’y’ \xrightarrow{平移} x’0y’ \xrightarrow{旋转} x0y$，注意是从目标到源

  • 平移变换 —— 将 $x’0’y’$ 坐标系的原点平移至 $x0y$ 坐标系的原点

  • 旋转变换 —— 将 $x’$ 轴旋转到 $x$ 轴上

5.4.7 任意参考点的几何变换

• 在以往的变换中，以 (0, 0) 为参考点，倘若以任意点为参考点，则：

  • 将参考点移到原点（平移）

  • 针对原点进行二维几何变换（变换）

  • 将原点移到参考点（反平移）

5.5 二维变换矩阵

5.5.1 二维变换矩阵概述

• 二维空间中某点的变化可以表示成点的齐次坐标与 3 阶的二维变换矩阵 $T_{2d}$ 相乘
  $$ \left[ \begin{matrix} x^* & y^* &1\end{matrix}\right] =\left[ \begin{matrix} x & y & 1 \end{matrix}\right]·T_{2d}=\left[ \begin{matrix} x & y & 1 \end{matrix}\right]· \left[ \begin{matrix} a&b&p\\c&d&q\\l&m&s \end{matrix} \right] $$

• 

5.5.2 二维图形几何变换的计算

• 点的变换：$\left[ \begin{matrix} x^* & y^* &1\end{matrix}\right] =\left[ \begin{matrix} x & y & 1 \end{matrix}\right]· T$

• 直线的变换（两端点的变换）：$\left[ \begin{matrix} x_1^* & y_1^* &1\ x_2^* & y_2^* &1\end{matrix}\right] =\left[ \begin{matrix} x_1 & y_1 &1\ x_2 & y_2 &1\end{matrix}\right] ·T$

• 多边形的变换（每个顶点的变换）：

5.4 窗口、视图及变换

5.4.1 窗口和视区

• 窗口：世界坐标系中要显示的区域

• 视区：窗口映射到显示器上的区域

• 窗口定义显示什么；视区定义在何处显示；二者需要进行坐标变换

  

• 世界坐标系中的一个窗口可以对应于多个视区

• $窗口\xrightarrow{观察变换} 视区$

5.4.2 观察变换

• 观察变换 (Viewing Transformation)

• 变焦距效果

  • 窗口放大/缩小，视区不变，图形缩小/放大

  

• 整体缩放效果

  • 窗口不变，视区放大/缩小，图形放大/缩小

  

• 漫游效果

  • 把一个固定大小的窗口在一幅大图形上移动，视区不变。

5.4.3 窗口到视区的变换

• 窗口的点 $\rightarrow$ 视区的点

• 保持比例的映射

  • 保持比例：映射之后，中心点仍然在中心，边界点仍然在边界

  • $\begin{cases} sx = A\times x+C \ sy = B\times y+D\end{cases}$

  • 比例保持：$\Large \frac{x-w_{xl}}{w_{xr}-w_{xl}} = \frac{sx-v_{xl}}{v_{xr}-v_{xl}} \Rightarrow sx = \frac{x-w_{xl}}{w_{xr}-w_{xl}}(v_{xr}-v_{xl})+v_{xl}$

  • 根据倍数关系：$\large sx = \frac{v_{xr}-v_{xl}}{w_{xr}-w_{xl}} x + (v_{xl}-\frac{v_{xr}-v_{xl}}{w_{xr}-w_{xl}} w_{xl}) = Ax + C，\ A = \frac{v_{xr}-v_{xl}}{w_{xr}-w_{xl}}，C=v_{xl}-A\times w_{xl}$

  • 同理，$\large B= \frac{v_{yt}-v_{yb}}{w_{yt}-w_{yb}}，D=v_{yb}-B\times w_{yb}$

资料来源

• 计算机图形学 - 中国农业大学 - MOOC

• Previous
  计算机图形学完整笔记（四）：消隐
• Next
  计算机图形学完整笔记（六）：三维图形变换