在介绍矩阵变换transform()前,我们来说一说什么是变换矩阵。
以上是Canvas中transform()方法所对应的变换矩阵。而此方法正是传入图中所示的六个参数,具体为context.transform(a,b,c,d,e,f)。
各参数意义对应如下表:
参数
意义
a
水平缩放(1)
b
水平倾斜(0)
c
垂直倾斜(0)
d
垂直缩放(1)
e
水平位移(0)
f
垂直位移(0)
当我们把对应的0或1代入进矩阵,可以发现这是一个单位矩阵(水平和垂直缩放默认值是1,代表缩放1倍,即不缩放)。该方法使用一个新的变化矩阵与当前变换矩阵进行乘法运算,然后