剪切变换的一些理解

900 阅读2分钟

剪切,有的翻译成错切,扭曲,英文对应Shear或者Skew,CSS3中的SkewX和SkewY函数对应。

剪切变换,也叫错切变换,图像以它的中心垂直轴不变动的方式变形,它不是一种相似变换,会发生形变。从图形上看,剪切变换将所有点沿着某一个指定方向成比例的平移。比较常见的例子,一个正方形经过横向或者纵向拉伸变成平行四边形。

其矩阵表示形式

[1shx0shy10001]\left[ \begin{matrix} 1 & shx & 0 \\ shy & 1 & 0 \\ 0 & 0 & 1 \\ \end{matrix} \right]

剪切变换分为两种

1、Horizontal Sheering,水平切变,沿着X轴方向,所有点沿着X方向平移,点的y坐标不变,点的x坐标沿着X轴发生平移,平移距离与切变因子成比例,x' = x + cy,其中c为切变因子,y为点的y坐标,即平移距离与点Y坐标成比例,点的Y坐标可以理解为点到不变线X轴的距离。矩阵表示上第二组基发生变化。

水平错切表示形式

[1shx0010001]\left[ \begin{matrix} 1 & shx & 0 \\ 0 & 1 & 0 \\ 0 & 0 & 1 \\ \end{matrix} \right]

2、Vertical Sheering,垂直切变,沿着Y轴方向,所有点沿着Y方向平移,点的x坐标不变,点的y坐标沿着Y轴发生平移,平移距离与切变因子成比例,y' = y + cx,其中c为切边因子,x为点的x坐标,即平移距离与点X坐标成比例,点的Y坐标可以理解为点到不变线Y轴的距离。矩阵表示上第一组基发生变化。

垂直错切表示形式

[1sh00shy10001]\left[ \begin{matrix} 1 & sh0 & 0 \\ shy & 1 & 0 \\ 0 & 0 & 1 \\ \end{matrix} \right]

关于变换的几个基本理解:

  1. 坐标系是由坐标原点和基向量决定,坐标原点和基向量确定了,坐标系就确定了
  2. 坐标系的变化,即基向量和原点的变化