javascript - CSS矩阵乘法

Question

根据 WebKitCSSMatrix documentation , multiply() 函数“返回此矩阵与右侧给定矩阵相乘的结果。”。所以

a.multiply(b) 必须等于数学符号中的 a b。

但是看起来a.multiply(b)确实等于b a；结果等于左边给定矩阵的乘积。

举个例子:

让一个:

 2, -2,  5,  0
-1,  0, 12,  0
 3,  1, -2,  0
 0,  0,  0,  1

和乙:

 1,  4,  3,  0
 3,  1,  5,  0
 3,  4,  3,  0
 0,  0,  0,  1

使用 this tool a b 的乘积是

c = a b:

11, 26, 11,  0
35, 44, 33,  0
0,   5,  8,  0
0,   0,  0,  1

在 JavaScript 中:

a = new WebKitCSSMatrix("matrix3d(2,-2,5,0,  -1,0,12,0,  3,1,-2,0,  0,0,0,1)")
b = new WebKitCSSMatrix("matrix3d(1,4,3,0,  3,1,5,0,  3,4,3,0,  0,0,0,1)");

和a.multiply(b)是:

7,   1,  47,  0
20, -1,  17,  0
11, -3,  57,  0
0,   0,   0,  1

但实际上 b.multiply(a) 是矩阵 c。

我错过了什么吗？

Answer 1

您的观察是正确的，但规范的描述也是正确的。您必须注意的是，CSS 规范中定义的矩阵是列优先的，而大多数数学书籍将以行优先格式处理矩阵。尝试转换它，看看会发生什么。