几何接口模块 1 级

1. 简介

本节为非规范性内容。

本规范描述了若干用于表示点、矩形、四边形以及维度为 3x2 和 4x4 的变换矩阵的几何接口。

SVG 接口 SVGPoint、SVGRect 和 SVGMatrix 在此处定义的接口上创建了别名，以兼容 SVG、Canvas 2D Context 和 CSS 变换常用接口。 [SVG11] [HTML] [CSS3-TRANSFORMS]

2. DOMPoint 接口

一个二维或三维的点可以通过下列 WebIDL 接口表示：

[Constructor(optional unrestricted double x = 0, optional unrestricted double y = 0,
             optional unrestricted double z = 0, optional unrestricted double w = 1),
 Exposed=(Window,Worker),
 Serializable]
interface DOMPointReadOnly {
    [NewObject] static DOMPointReadOnly fromPoint(optional DOMPointInit other);

    readonly attribute unrestricted double x;
    readonly attribute unrestricted double y;
    readonly attribute unrestricted double z;
    readonly attribute unrestricted double w;

    DOMPoint matrixTransform(optional DOMMatrixInit matrix);

    [Default] object toJSON();
};

[Constructor(optional unrestricted double x = 0, optional unrestricted double y = 0,
             optional unrestricted double z = 0, optional unrestricted double w = 1),
 Exposed=(Window,Worker),
 Serializable,
 LegacyWindowAlias=SVGPoint]
interface DOMPoint : DOMPointReadOnly {
    [NewObject] static DOMPoint fromPoint(optional DOMPointInit other);

    inherit attribute unrestricted double x;
    inherit attribute unrestricted double y;
    inherit attribute unrestricted double z;
    inherit attribute unrestricted double w;
};

dictionary DOMPointInit {
    unrestricted double x = 0;
    unrestricted double y = 0;
    unrestricted double z = 0;
    unrestricted double w = 1;
};

下列算法假定 DOMPointReadOnly 对象具有内部成员变量 x coordinate、y coordinate、z coordinate 和 w perspective。 DOMPointReadOnly 以及继承该接口的 DOMPoint 必须能够访问并设置这些变量的值。

通过属性或函数返回 DOMPointReadOnly 对象的接口可能能够修改内部成员变量值。此类接口必须在正文中明确说明该能力。

内部成员变量不得以任何方式被暴露。

DOMPointReadOnly(x, y, z, w) 和 DOMPoint(x, y, z, w) 构造函数在调用时，必须执行以下步骤：

令 point 为一个新的 DOMPointReadOnly 或者相应的 DOMPoint 对象。
将 point 的变量 x coordinate 设为 x，y coordinate 设为 y，z coordinate 设为 z，以及将 w perspective 设为 w。
返回 point。

fromPoint(other) 静态方法在 DOMPointReadOnly 上必须从字典创建一个 DOMPointReadOnly，使用 other。

fromPoint(other) 静态方法在 DOMPoint 上必须从字典创建一个 DOMPoint，使用 other。

要从字典创建一个 DOMPointReadOnly other，或者要从字典创建一个 DOMPoint other，请按以下步骤操作：

令 point 为一个新的 DOMPointReadOnly 或相应的 DOMPoint 对象。
将 point 的变量 x coordinate 设为 other 的字典成员 x，将 y coordinate 设为 other 的字典成员 y，将 z coordinate 设为 other 的字典成员 z，以及将 w perspective 设为 other 的字典成员 w。
返回 point。

属性 x 在获取时，必须返回 x coordinate 的值。对于 DOMPoint 接口，设置属性 x 必须将 x coordinate 设为新值。

属性 y 在获取时，必须返回 y coordinate 的值。对于 DOMPoint 接口，设置属性 y 必须将 y coordinate 设为新值。

属性 z 在获取时，必须返回 z coordinate 的值。对于 DOMPoint 接口，设置属性 z 必须将 z coordinate 设为新值。

属性 w 在获取时，必须返回 w perspective 的值。对于 DOMPoint 接口，设置属性 w 必须将 w perspective 设为新值。

方法 matrixTransform(matrix) 在调用时，必须执行以下步骤：

令 matrixObject 为调用从字典创建一个 DOMMatrix（使用 matrix）的结果。
返回调用用矩阵变换点（以当前点和 matrixObject 为参数）的结果。当前点不会被修改。

在此示例中，matrixTransform() 方法在一个 DOMPoint 实例上被调用，并以一个 DOMMatrix 实例作为参数。

var point = new DOMPoint(5, 4);
var matrix = new DOMMatrix([2, 0, 0, 2, 10, 10]);
var transformedPoint = point.matrixTransform(matrix);

变量 point 被设置为一个新的 DOMPoint 对象，其 x coordinate 初始化为 5，y coordinate 初始化为 4。该新的 DOMPoint 现在被按 matrix 进行缩放并平移。结果的 transformedPoint 的 x coordinate 为 20，y coordinate 为 18。

2.1. 用矩阵变换点

要用矩阵变换一个点，给定 point 和 matrix：

令 x 为 point 的 x coordinate。
令 y 为 point 的 y coordinate。
令 z 为 point 的 z coordinate。
令 w 为 point 的 w perspective。
令 pointVector 为一个新的列向量，其元素分别为 x、y、z 和 w。
$[\begin{matrix} x \\ y \\ z \\ w \end{matrix}]$
将 pointVector 设置为 pointVector 被 matrix 后乘的结果。
令 transformedPoint 为一个新的 DOMPoint 对象。
将 transformedPoint 的 x coordinate 设为 pointVector 的第一个元素。
将 transformedPoint 的 y coordinate 设为 pointVector 的第二个元素。
将 transformedPoint 的 z coordinate 设为 pointVector 的第三个元素。
将 transformedPoint 的 w perspective 设为 pointVector 的第四个元素。
返回 transformedPoint。

注：如果 matrix 的 is 2D 为真，point 的 z coordinate 为 0 或 -0，且 point 的 w perspective 为 1，那么这是一个二维变换。否则这是一个三维变换。

3. DOMRect 接口

实现 DOMRectReadOnly 接口的对象表示一个矩形。

矩形具有如下属性：

origin（原点）: 当矩形的 width dimension（宽度）为非负时，矩形的水平方向原点为左边缘；否则为右边缘。类似地，当矩形的 height dimension（高度）为非负时，矩形的垂直方向原点为顶部；否则为底部。
x coordinate: 视口左边缘与矩形的 origin（原点）之间的水平距离。
y coordinate: 视口顶部与矩形的 origin（原点）之间的垂直距离。
width dimension: 矩形的宽度。可以为负。
height dimension: 矩形的高度。可以为负。

[Constructor(optional unrestricted double x = 0, optional unrestricted double y = 0,
             optional unrestricted double width = 0, optional unrestricted double height = 0),
 Exposed=(Window,Worker),
 Serializable]
interface DOMRectReadOnly {
    [NewObject] static DOMRectReadOnly fromRect(optional DOMRectInit other);

    readonly attribute unrestricted double x;
    readonly attribute unrestricted double y;
    readonly attribute unrestricted double width;
    readonly attribute unrestricted double height;
    readonly attribute unrestricted double top;
    readonly attribute unrestricted double right;
    readonly attribute unrestricted double bottom;
    readonly attribute unrestricted double left;

    [Default] object toJSON();
};

[Constructor(optional unrestricted double x = 0, optional unrestricted double y = 0,
             optional unrestricted double width = 0, optional unrestricted double height = 0),
 Exposed=(Window,Worker),
 Serializable,
 LegacyWindowAlias=SVGRect]
interface DOMRect : DOMRectReadOnly {
    [NewObject] static DOMRect fromRect(optional DOMRectInit other);

    inherit attribute unrestricted double x;
    inherit attribute unrestricted double y;
    inherit attribute unrestricted double width;
    inherit attribute unrestricted double height;
};

dictionary DOMRectInit {
    unrestricted double x = 0;
    unrestricted double y = 0;
    unrestricted double width = 0;
    unrestricted double height = 0;
};

下列算法假定 DOMRectReadOnly 对象具有内部成员变量 x coordinate、y coordinate、width dimension 和 height dimension。DOMRectReadOnly 以及继承该接口的 DOMRect 必须能够访问并设置这些变量的值。

通过属性或函数返回 DOMRectReadOnly 对象的接口可能能够修改内部成员变量值。此类接口必须在正文中明确说明该能力。

内部成员变量不得以任何方式被暴露。

DOMRectReadOnly(x, y, width, height) 和 DOMRect(x, y, width, height) 构造函数在调用时，必须运行以下步骤：

令 rect 为一个新的 DOMRectReadOnly 或相应的 DOMRect 对象。
将 rect 的内部变量 x coordinate 设为 x，y coordinate 设为 y，width dimension 设为 width，以及 height dimension 设为 height。
返回 rect。

fromRect(other) 静态方法在 DOMRectReadOnly 上，必须从字典创建一个 DOMRectReadOnly，使用 other。

fromRect(other) 静态方法在 DOMRect 上，必须从字典创建一个 DOMRect，使用 other。

要从字典创建一个 DOMRectReadOnly other，或要从字典创建一个 DOMRect other，请遵循以下步骤：

令 rect 为一个新的 DOMRectReadOnly 或相应的 DOMRect 对象。
将 rect 的内部变量 x coordinate 设为 other 的字典成员 x，将 y coordinate 设为 other 的字典成员 y，将 width dimension 设为 other 的字典成员 width，以及将 height dimension 设为 other 的字典成员 height。
返回 rect。

x 属性在获取时必须返回 x coordinate 的值。对于 DOMRect 接口，设置 x 属性必须将 x coordinate 设为新值。

y 属性在获取时必须返回 y coordinate 的值。对于 DOMRect 接口，设置 y 属性必须将 y coordinate 设为新值。

width 属性在获取时必须返回 width dimension 的值。对于 DOMRect 接口，设置 width 属性必须将 width dimension 设为新值。

height 属性在获取时必须返回 height dimension 的值。对于 DOMRect 接口，设置 height 属性必须将 height dimension 设为新值。

top 属性在获取时必须返回 min(y coordinate, y coordinate + height dimension)。

right 属性在获取时必须返回 max(x coordinate, x coordinate + width dimension)。

bottom 属性在获取时必须返回 max(y coordinate, y coordinate + height dimension)。

left 属性在获取时必须返回 min(x coordinate, x coordinate + width dimension)。

4. DOMRectList 接口

interface DOMRectList {
    readonly attribute unsigned long length;
    getter DOMRect? item(unsigned long index);
};

length 属性必须返回与该对象关联的 DOMRect 对象的总数。

item(index) 方法在调用时，当 index 大于或等于与 DOMRect 对象数量时，必须返回 null。否则，必须返回位于 index 的 DOMRect 对象。索引从零开始。

DOMRectList 仅为与遗留 Web 内容兼容而存在。在指定新 API 时，不应使用 DOMRectList。应改用 sequence<DOMRect>。 [WEBIDL]

5. DOMQuad 接口

实现 DOMQuad 接口的对象表示一个四边形。

[Constructor(optional DOMPointInit p1, optional DOMPointInit p2,
             optional DOMPointInit p3, optional DOMPointInit p4),
 Exposed=(Window,Worker),
 Serializable]
interface DOMQuad {
    [NewObject] static DOMQuad fromRect(optional DOMRectInit other);
    [NewObject] static DOMQuad fromQuad(optional DOMQuadInit other);

    [SameObject] readonly attribute DOMPoint p1;
    [SameObject] readonly attribute DOMPoint p2;
    [SameObject] readonly attribute DOMPoint p3;
    [SameObject] readonly attribute DOMPoint p4;
    [NewObject] DOMRect getBounds();

    [Default] object toJSON();
};

dictionary DOMQuadInit {
  DOMPointInit p1;
  DOMPointInit p2;
  DOMPointInit p3;
  DOMPointInit p4;
};

下列算法假定 DOMQuad 对象具有内部成员变量 point 1、point 2、point 3 和 point 4，它们是 DOMPoint 对象。DOMQuad 必须能够访问并设置这些变量的值。作者可以修改这些 DOMPoint 对象，从而直接影响四边形。

通过属性或函数返回 DOMQuad 对象的接口可能能够修改内部成员变量值。此类接口必须在正文中明确说明该能力。

内部成员变量不得以任何方式被暴露。

DOMQuad(p1, p2, p3, p4) 构造函数在调用时，必须运行以下步骤：

令 point1 为一个新的 DOMPoint 对象，其属性设置为 p1 字典成员的同名值。
令 point2 为一个新的 DOMPoint 对象，其属性设置为 p2 字典成员的同名值。
令 point3 为一个新的 DOMPoint 对象，其属性设置为 p3 字典成员的同名值。
令 point4 为一个新的 DOMPoint 对象，其属性设置为 p4 字典成员的同名值。
返回一个新的 DOMQuad，其中 point 1 设置为 point1，point 2 设置为 point2，point 3 设置为 point3，以及 point 4 设置为 point4。

注：也可以传递 DOMPoint / DOMPointReadOnly 类型的参数。传入的参数将根据 WebIDL 规则在内部转换为正确的对象类型。 [WEBIDL]

fromRect(other) 静态方法在 DOMQuad 上，必须从 DOMRectInit 字典创建一个 DOMQuad，使用 other。

要从 DOMRectInit 字典创建一个 DOMQuad other，请遵循以下步骤：

令 x, y, width 和 height 分别为 other 的字典成员 x, y, width 和 height 的值。
令 point1 为一个新的 DOMPoint 对象，其 x coordinate 设为 x，y coordinate 设为 y，z coordinate 设为 0，以及 w perspective 设为 1。
令 point2 为一个新的 DOMPoint 对象，其 x coordinate 设为 x + width，y coordinate 设为 y，z coordinate 设为 0，以及 w perspective 设为 1。
令 point3 为一个新的 DOMPoint 对象，其 x coordinate 设为 x + width，y coordinate 设为 y + height，z coordinate 设为 0，以及 w perspective 设为 1。
令 point4 为一个新的 DOMPoint 对象，其 x coordinate 设为 x，y coordinate 设为 y + height，z coordinate 设为 0，以及 w perspective 设为 1。
返回一个新的 DOMQuad，其 point 1 设为 point1，point 2 设为 point2，point 3 设为 point3，以及 point 4 设为 point4。

fromQuad(other) 静态方法在 DOMQuad 上，必须从 DOMQuadInit 字典创建一个 DOMQuad，使用 other。

要从 DOMQuadInit 字典创建一个 DOMQuad other，请遵循以下步骤：

令 point1 为调用从字典创建一个 DOMPoint（如果存在）对 p1 字典成员的结果。
令 point2 为调用从字典创建一个 DOMPoint（如果存在）对 p2 字典成员的结果。
令 point3 为调用从字典创建一个 DOMPoint（如果存在）对 p3 字典成员的结果。
令 point4 为调用从字典创建一个 DOMPoint（如果存在）对 p4 字典成员的结果。
返回一个新的 DOMQuad，其 point 1 设为 point1，point 2 设为 point2，point 3 设为 point3，以及 point 4 设为 point4。

p1 属性必须返回 point 1。

p2 属性必须返回 point 2。

p3 属性必须返回 point 3。

p4 属性必须返回 point 4。

getBounds() 方法在调用时必须运行以下算法：

令 bounds 为一个 DOMRect 对象。
令 left 为 point 1 的 x coordinate、point 2 的 x coordinate、point 3 的 x coordinate 和 point 4 的 x coordinate 的最小值。
令 top 为 point 1 的 y coordinate、point 2 的 y coordinate、point 3 的 y coordinate 和 point 4 的 y coordinate 的最小值。
令 right 为 point 1 的 x coordinate、point 2 的 x coordinate、point 3 的 x coordinate 和 point 4 的 x coordinate 的最大值。
令 bottom 为 point 1 的 y coordinate、point 2 的 y coordinate、point 3 的 y coordinate 和 point 4 的 y coordinate 的最大值。
将 x 坐标的 bounds 设为 left，将 y 坐标的 bounds 设为 top，将宽度尺度的 bounds 设为 right - left，将高度尺度的 bounds 设为 bottom - top。
返回 bounds。

在此示例中，DOMQuad 构造函数以类型为 DOMPoint 和 DOMPointInit 的参数被调用。两种参数都被接受并可使用。

var point = new DOMPoint(2, 0);
var quad1 = new DOMQuad(point, {x: 12, y: 0}, {x: 12, y: 10}, {x: 2, y: 10});

上面得到的 DOMQuad 变量 quad1 的属性值也等同于下面构造的 DOMQuad 变量 quad2 的属性值：

var rect = new DOMRect(2, 0, 10, 10);
var quad2 = DOMQuad.fromRect(rect);

这是一个不规则四边形的示例：

new DOMQuad({x: 40, y: 25}, {x: 180, y: 8}, {x: 210, y: 150}, {x: 10, y: 180});

一个由 DOMQuad 表示的不规则四边形。四个红色圆点表示属性 DOMPoint 的 p1 到 p4。虚线矩形表示 getBounds() 方法返回的包围矩形。

6. DOMMatrix 接口

DOMMatrix 和 DOMMatrixReadOnly 接口各自表示一个数学上的矩阵，用于在图形上下文中描述变换。下列各节描述了该接口的详细信息。

[\begin{matrix} m_{11} & m_{21} & m_{31} & m_{41} \\ m_{12} & m_{22} & m_{32} & m_{42} \\ m_{13} & m_{23} & m_{33} & m_{43} \\ m_{14} & m_{24} & m_{34} & m_{44} \end{matrix}]

一个带有元素 m₁₁ 到 m₄₄ 的 4x4 抽象矩阵。

在下列各节中，术语具有如下含义：

后乘（post-multiply）: 项 A 被项 B 后乘等于 A · B。
前乘（pre-multiply）: 项 A 被项 B 前乘等于 B · A。
相乘（multiply）: 将项 A 与项 B 相乘等于 A · B。

[Constructor(optional (DOMString or sequence<unrestricted double>) init),
 Exposed=(Window,Worker),
 Serializable]
interface DOMMatrixReadOnly {
    [NewObject] static DOMMatrixReadOnly fromMatrix(optional DOMMatrixInit other);
    [NewObject] static DOMMatrixReadOnly fromFloat32Array(Float32Array array32);
    [NewObject] static DOMMatrixReadOnly fromFloat64Array(Float64Array array64);

    // These attributes are simple aliases for certain elements of the 4x4 matrix
    readonly attribute unrestricted double a;
    readonly attribute unrestricted double b;
    readonly attribute unrestricted double c;
    readonly attribute unrestricted double d;
    readonly attribute unrestricted double e;
    readonly attribute unrestricted double f;

    readonly attribute unrestricted double m11;
    readonly attribute unrestricted double m12;
    readonly attribute unrestricted double m13;
    readonly attribute unrestricted double m14;
    readonly attribute unrestricted double m21;
    readonly attribute unrestricted double m22;
    readonly attribute unrestricted double m23;
    readonly attribute unrestricted double m24;
    readonly attribute unrestricted double m31;
    readonly attribute unrestricted double m32;
    readonly attribute unrestricted double m33;
    readonly attribute unrestricted double m34;
    readonly attribute unrestricted double m41;
    readonly attribute unrestricted double m42;
    readonly attribute unrestricted double m43;
    readonly attribute unrestricted double m44;

    readonly attribute boolean is2D;
    readonly attribute boolean isIdentity;

    // Immutable transform methods
    [NewObject] DOMMatrix translate(optional unrestricted double tx = 0,
                                    optional unrestricted double ty = 0,
                                    optional unrestricted double tz = 0);
    [NewObject] DOMMatrix scale(optional unrestricted double scaleX = 1,
                                optional unrestricted double scaleY,
                                optional unrestricted double scaleZ = 1,
                                optional unrestricted double originX = 0,
                                optional unrestricted double originY = 0,
                                optional unrestricted double originZ = 0);
    [NewObject] DOMMatrix scaleNonUniform(optional unrestricted double scaleX = 1,
                                          optional unrestricted double scaleY = 1);
    [NewObject] DOMMatrix scale3d(optional unrestricted double scale = 1,
                                  optional unrestricted double originX = 0,
                                  optional unrestricted double originY = 0,
                                  optional unrestricted double originZ = 0);
    [NewObject] DOMMatrix rotate(optional unrestricted double rotX = 0,
                                 optional unrestricted double rotY,
                                 optional unrestricted double rotZ);
    [NewObject] DOMMatrix rotateFromVector(optional unrestricted double x = 0,
                                           optional unrestricted double y = 0);
    [NewObject] DOMMatrix rotateAxisAngle(optional unrestricted double x = 0,
                                          optional unrestricted double y = 0,
                                          optional unrestricted double z = 0,
                                          optional unrestricted double angle = 0);
    [NewObject] DOMMatrix skewX(optional unrestricted double sx = 0);
    [NewObject] DOMMatrix skewY(optional unrestricted double sy = 0);
    [NewObject] DOMMatrix multiply(optional DOMMatrixInit other);
    [NewObject] DOMMatrix flipX();
    [NewObject] DOMMatrix flipY();
    [NewObject] DOMMatrix inverse();

    [NewObject] DOMPoint transformPoint(optional DOMPointInit point);
    [NewObject] Float32Array toFloat32Array();
    [NewObject] Float64Array toFloat64Array();

    [Exposed=Window] stringifier;
    [Default] object toJSON();
};

下列算法假定 DOMMatrixReadOnly 对象具有内部成员变量 m11 element, m12 element, m13 element, m14 element, m21 element, m22 element, m23 element, m24 element, m31 element, m32 element, m33 element, m34 element, m41 element, m42 element, m43 element, m44 element and is 2D. DOMMatrixReadOnly 以及继承该接口的 DOMMatrix 必须能够访问并设置这些变量的值。

通过属性或函数返回 DOMMatrixReadOnly 对象的接口可能能够修改内部成员变量值。此类接口必须在正文中明确说明该能力。

内部成员变量不得以任何方式被暴露。

DOMMatrix 和 DOMMatrixReadOnly 接口取代了来自 SVG 的 SVGMatrix 接口。 [SVG11]

6.1. DOMMatrix2DInit 和 DOMMatrixInit 字典

要对一个 DOMMatrix2DInit 或 DOMMatrixInit 字典 dict 进行验证并修正（2D），请运行下列步骤：

如果 dict 满足下列至少一项条件，则抛出一个 TypeError 异常并中止这些步骤。
- a 和 m11 同时存在，且 SameValueZero(a, m11) 为 false。
- b 和 m12 同时存在，且 SameValueZero(b, m12) 为 false。
- c 和 m21 同时存在，且 SameValueZero(c, m21) 为 false。
- d 和 m22 同时存在，且 SameValueZero(d, m22) 为 false。
- e 和 m41 同时存在，且 SameValueZero(e, m41) 为 false。
- f 和 m42 同时存在，且 SameValueZero(f, m42) 为 false。
如果 m11 不存在，则将其设置为成员 a 的值，若 a 也不存在，则设为值 1。
如果 m12 不存在，则将其设置为成员 b 的值，若 b 也不存在，则设为值 0。
如果 m21 不存在，则将其设置为成员 c 的值，若 c 也不存在，则设为值 0。
如果 m22 不存在，则将其设置为成员 d 的值，若 d 也不存在，则设为值 1。
如果 m41 不存在，则将其设置为成员 e 的值，若 e 也不存在，则设为值 0。
如果 m42 不存在，则将其设置为成员 f 的值，若 f 也不存在，则设为值 0。

注： SameValueZero 比较算法对两个 NaN 值返回 true，并且对于 0 和 -0 也返回 true。 [ECMA-262]

要对一个 DOMMatrixInit 字典 dict 进行验证并修正，请运行下列步骤：

对 dict 执行验证并修正（2D）。
如果 is2D 为 true，并且：下列任一成员 m13、 m14、 m23、 m24、 m31、 m32、 m34、 m43 的值存在且不为 0 或 -0，或者下列任一成员 m33、 m44 的值存在且不为 1，则抛出一个 TypeError 异常并中止这些步骤。
如果 is2D 未出现并且下列任一成员 m13、 m14、 m23、 m24、 m31、 m32、 m34、 m43 的值存在且不为 0 或 -0，或者下列任一成员 m33、 m44 的值存在且不为 1，则将 is2D 设为 false。
如果 is2D 仍然未出现，则将其设置为 true。

6.2. 将字符串解析为抽象矩阵

要将字符串 transformList 解析为抽象矩阵，意味着运行下列步骤。它将返回一个 4x4 抽象矩阵和一个布尔值 2dTransform，或者返回失败。

如果 transformList 是空字符串，则将其设为字符串 "matrix(1, 0, 0, 1, 0, 0)"。
将 transformList 按照 CSS transform 属性的语法解析为 parsedValue。结果将是一个 <transform-list>、关键字 none，或失败。如果 parsedValue 为失败，或者任一 <transform-function> 使用了没有绝对长度单位的 <length> 值，或使用了除 none 以外的关键字，则返回失败。 [CSS3-SYNTAX] [CSS3-TRANSFORMS]
如果 parsedValue 是 none，则将 parsedValue 设为包含单个单位矩阵的 <transform-list>。
令 2dTransform 跟踪 parsedValue 的二维/三维维度状态。

如果 parsedValue 包含任一三维变换函数

将 2dTransform 设为 false。

否则

将 2dTransform 设为 true。
将所有 <transform-function> 按照“变换函数的数学描述”转换为 4x4 抽象矩阵。 [CSS3-TRANSFORMS]
令 matrix 为本节最初图示所示的 4x4 抽象矩阵。按从左到右的顺序对所有矩阵进行后乘，并将乘积赋给 matrix。
返回 matrix 和 2dTransform。

6.3. 创建 DOMMatrixReadOnly 和 DOMMatrix 对象

要创建类型为 type（取值为 DOMMatrixReadOnly 或 DOMMatrix）的二维矩阵（create a 2d matrix），使用长度为 6 的序列 init，按下列步骤执行：

令 matrix 为 type 的一个新实例。
将 m11 element、m12 element、m21 element、m22 element、m41 element 和 m42 element 依次设为 init 的值（从第一个值开始）。
将 m13 element、m14 element、m23 element、m24 element、m31 element、m32 element、m34 element 和 m43 element 设为 0。
将 m33 element 和 m44 element 设为 1。
将 is 2D 设为 true。
返回 matrix

要创建类型为 type（取值为 DOMMatrixReadOnly 或 DOMMatrix）的三维矩阵（create a 3d matrix），使用长度为 16 的序列 init，按下列步骤执行：

令 matrix 为 type 的一个新实例。
将 m11 element 到 m44 element 设为按列主序（column-major order）从 init 取得的值。
将 is 2D 设为 false。
返回 matrix

DOMMatrixReadOnly(init) 和 DOMMatrix(init) 构造函数必须遵循下列步骤：

如果省略 init

返回按适当类型（DOMMatrixReadOnly 或 DOMMatrix）调用 create a 2d matrix 的结果，所用序列为 [1, 0, 0, 1, 0, 0]。

如果 init 是 DOMString

如果当前全局对象不是 Window 对象，则抛出一个 TypeError 异常。
将 init 解析为抽象矩阵，并令 matrix 与 2dTransform 为结果。如果结果为失败，则抛出一个 "SyntaxError" DOMException。
如果 2dTransform 为 true

按适当类型（DOMMatrixReadOnly 或 DOMMatrix）调用 create a 2d matrix 并返回其结果，所用序列为数值序列，其值为 matrix 的元素 m11, m12, m21, m22, m41 和 m42。

否则

按适当类型（DOMMatrixReadOnly 或 DOMMatrix）调用 create a 3d matrix 并返回其结果，所用序列为数值序列，其值为 matrix 的 16 个元素。

如果 init 是包含 6 个元素的序列

按适当类型（DOMMatrixReadOnly 或 DOMMatrix）调用 create a 2d matrix 并返回其结果，所用序列为 init。

如果 init 是包含 16 个元素的序列

按适当类型（DOMMatrixReadOnly 或 DOMMatrix）调用 create a 3d matrix 并返回其结果，所用序列为 init。

否则

抛出一个 TypeError 异常。

fromMatrix(other) 静态方法在 DOMMatrixReadOnly 上必须从字典创建一个 DOMMatrixReadOnly 使用 other。

fromMatrix(other) 静态方法在 DOMMatrix 上必须从字典创建一个 DOMMatrix 使用 other。

要从 2D 字典创建一个 DOMMatrixReadOnly（create a DOMMatrixReadOnly from a 2D dictionary） other，或从 2D 字典创建一个 DOMMatrix（create a DOMMatrix from a 2D dictionary） other，请执行下列步骤：

对 other 执行验证并修正（2D）。
按适当类型（DOMMatrixReadOnly 或 DOMMatrix）调用 create a 2d matrix 并返回其结果，所用序列为数值序列，其值为 other 的 6 个元素 m11, m12, m21, m22, m41 和 m42（按给定顺序）。

要从字典创建一个 DOMMatrixReadOnly（create a DOMMatrixReadOnly from a dictionary） other，或从字典创建一个 DOMMatrix（create a DOMMatrix from a dictionary） other，请执行下列步骤：

对 other 执行验证并修正。
如果 other 的 is2D 字典成员为 true

按适当类型（DOMMatrixReadOnly 或 DOMMatrix）调用 create a 2d matrix 并返回其结果，所用序列为数值序列，其值为 other 的 6 个元素 m11, m12, m21, m22, m41 和 m42（按给定顺序）。

否则

按适当类型（DOMMatrixReadOnly 或 DOMMatrix）调用 create a 3d matrix 并返回其结果，所用序列为数值序列，其值为 other 的 16 个元素 m11, m12, m13, ..., m44（按给定顺序）。

fromFloat32Array(array32) 静态方法在 DOMMatrixReadOnly 和 fromFloat32Array(array32) 静态方法在 DOMMatrix 上必须遵循下列步骤：

如果 array32 有 6 个元素: 按适当类型（DOMMatrixReadOnly 或 DOMMatrix）调用 create a 2d matrix 并返回其结果，所用序列为数值序列，从 array32 中按提供顺序取值。
如果 array32 有 16 个元素: 按适当类型（DOMMatrixReadOnly 或 DOMMatrix）调用 create a 3d matrix 并返回其结果，所用序列为数值序列，从 array32 中按提供顺序取值。
否则: 抛出一个 TypeError 异常。

fromFloat64Array(array64) 静态方法在 DOMMatrixReadOnly 和 fromFloat64Array(array64) 静态方法在 DOMMatrix 上必须遵循下列步骤：

如果 array64 有 6 个元素: 按适当类型（DOMMatrixReadOnly 或 DOMMatrix）调用 create a 2d matrix 并返回其结果，所用序列为数值序列，从 array64 中按提供顺序取值。
如果 array32 有 16 个元素: 按适当类型（DOMMatrixReadOnly 或 DOMMatrix）调用 create a 3d matrix 并返回其结果，所用序列为数值序列，从 array64 中按提供顺序取值。
否则: 抛出一个 TypeError 异常。

6.4. DOMMatrix 属性

下列属性 m11 到 m44 对应于矩阵接口的 16 个元素。

m11 和 a 属性在读取时必须返回 m11 element 的值。对于 DOMMatrix 接口，设置 m11 或 a 属性时，必须将 m11 element 设为新值。

m12 和 b 属性在读取时必须返回 m12 element 的值。对于 DOMMatrix 接口，设置 m12 或 b 属性时，必须将 m12 element 设为新值。

m13 属性在读取时必须返回 m13 element 的值。对于 DOMMatrix 接口，设置 m13 属性时，必须将 m13 element 设为新值，并且如果新值不是 0 或 -0，则将 is 2D 设为 false。

m14 属性在读取时必须返回 m14 element 的值。对于 DOMMatrix 接口，设置 m14 属性时，必须将 m14 element 设为新值，并且如果新值不是 0 或 -0，则将 is 2D 设为 false。

m21 和 c 属性在读取时必须返回 m21 element 的值。对于 DOMMatrix 接口，设置 m21 或 c 属性时，必须将 m21 element 设为新值。

m22 和 d 属性在读取时必须返回 m22 element 的值。对于 DOMMatrix 接口，设置 m22 或 d 属性时，必须将 m22 element 设为新值。

m23 属性在读取时必须返回 m23 element 的值。对于 DOMMatrix 接口，设置 m23 属性时，必须将 m23 element 设为新值，并且如果新值不是 0 或 -0，则将 is 2D 设为 false。

m24 属性在读取时必须返回 m24 element 的值。对于 DOMMatrix 接口，设置 m24 属性时，必须将 m24 element 设为新值，并且如果新值不是 0 或 -0，则将 is 2D 设为 false。

m31 属性在读取时必须返回 m31 element 的值。对于 DOMMatrix 接口，设置 m31 属性时，必须将 m31 element 设为新值，并且如果新值不是 0 或 -0，则将 is 2D 设为 false。

m32 属性在读取时必须返回 m32 element 的值。对于 DOMMatrix 接口，设置 m32 属性时，必须将 m32 element 设为新值，并且如果新值不是 0 或 -0，则将 is 2D 设为 false。

m33 属性在读取时必须返回 m33 element 的值。对于 DOMMatrix 接口，设置 m33 属性时，必须将 m33 element 设为新值，并且如果新值不是 1，则将 is 2D 设为 false。

m34 属性在读取时必须返回 m34 element 的值。对于 DOMMatrix 接口，设置 m34 属性时，必须将 m34 element 设为新值，并且如果新值不是 0 或 -0，则将 is 2D 设为 false。

m41 和 e 属性在读取时必须返回 m41 element 的值。对于 DOMMatrix 接口，设置 m41 或 e 属性时，必须将 m41 element 设为新值。

m42 和 f 属性在读取时必须返回 m42 element 的值。对于 DOMMatrix 接口，设置 m42 或 f 属性时，必须将 m42 element 设为新值。

m43 属性在读取时必须返回 m43 element 的值。对于 DOMMatrix 接口，设置 m43 属性时，必须将 m43 element 设为新值，并且如果新值不是 0 或 -0，则将 is 2D 设为 false。

m44 属性在读取时必须返回 m44 element 的值。对于 DOMMatrix 接口，设置 m44 属性时，必须将 m44 element 设为新值，并且如果新值不是 1，则将 is 2D 设为 false。

下列属性 a 到 f 对应于矩阵接口的 2D 组件。

a 属性是 m11 属性的别名。

b 属性是 m12 属性的别名。

c 属性是 m21 属性的别名。

d 属性是 m22 属性的别名。

e 属性是 m41 属性的别名。

f 属性是 m42 属性的别名。

下列属性提供有关 DOMMatrixReadOnly 的状态信息。

is2D 属性必须返回 is 2D 的值。

isIdentity 属性必须在下列条件全部满足时返回 true：m12 element、m13 element、m14 element、m21 element、m23 element、m24 element、m31 element、m32 element、m34 element、m41 element、m42 element、m43 element 的值均为 0 或 -0，且 m11 element、m22 element、m33 element、m44 element 的值均为 1。否则应返回 false。

每个 DOMMatrixReadOnly 对象必须带有一个布尔标志 is 2D。该标志指示：

当前矩阵是作为 2D 矩阵初始化的。详见各创建函数（creators）。
仅应用了 2D 变换操作。每个可变或不可变的变换方法会定义是否必须将 is 2D 设为 false。

注：当 is 2D 在一个 DOMMatrix 对象上曾被设为 false 后，除非调用 setMatrixValue() 方法，否则该标志永远不能再被设为 true。

6.5. 不可变的变换方法

下列方法不会修改当前矩阵并返回一个新的 DOMMatrix 对象。

translate(tx, ty, tz)

令 result 为结果矩阵，其初始值设置为当前矩阵的各项值。
对 result 执行一个 translateSelf() 变换，参数为 tx, ty, tz。
返回 result。

当前矩阵不被修改。

scale(scaleX, scaleY, scaleZ, originX, originY, originZ)

如果缺少 scaleY，则将 scaleY 设为 scaleX 的值。
令 result 为结果矩阵，其初始值设置为当前矩阵的各项值。
对 result 执行一个 scaleSelf() 变换，参数为 scaleX, scaleY, scaleZ, originX, originY, originZ。
返回 result。

当前矩阵不被修改。

scaleNonUniform(scaleX, scaleY)

注：为与 SVG 1.1 中定义的 SVGMatrix 兼容而保留的遗留支持。建议作者改用 scale()。

令 result 为结果矩阵，其初始值设置为当前矩阵的各项值。
对 result 执行一个 scaleSelf() 变换，参数为 scaleX, scaleY, 1, 0, 0, 0。
返回 result。

当前矩阵不被修改。

scale3d(scale, originX, originY, originZ)

令 result 为结果矩阵，其初始值设置为当前矩阵的各项值。
对 result 执行一个 scale3dSelf() 变换，参数为 scale, originX, originY, originZ。
返回 result。

当前矩阵不被修改。

rotate(rotX, rotY, rotZ)

令 result 为结果矩阵，其初始值设置为当前矩阵的各项值。
对 result 执行一个 rotateSelf() 变换，参数为 rotX, rotY, rotZ。
返回 result。

当前矩阵不被修改。

rotateFromVector(x, y)

令 result 为结果矩阵，其初始值设置为当前矩阵的各项值。
对 result 执行一个 rotateFromVectorSelf() 变换，参数为 x, y。
返回 result。

当前矩阵不被修改。

rotateAxisAngle(x, y, z, angle)

令 result 为结果矩阵，其初始值设置为当前矩阵的各项值。
对 result 执行一个 rotateAxisAngleSelf() 变换，参数为 x, y, z, angle。
返回 result。

当前矩阵不被修改。

skewX(sx)

令 result 为结果矩阵，其初始值设置为当前矩阵的各项值。
对 result 执行一个 skewXSelf() 变换，参数为 sx。
返回 result。

当前矩阵不被修改。

skewY(sy)

令 result 为结果矩阵，其初始值设置为当前矩阵的各项值。
对 result 执行一个 skewYSelf() 变换，参数为 sy。
返回 result。

当前矩阵不被修改。

multiply(other)

令 result 为结果矩阵，其初始值设置为当前矩阵的各项值。
对 result 执行一个 multiplySelf() 变换，参数为 other。
返回 result。

当前矩阵不被修改。

flipX()

令 result 为结果矩阵，其初始值设置为当前矩阵的各项值。
对 result 进行后乘，与 new DOMMatrix([-1, 0, 0, 1, 0, 0]) 相乘。
返回 result。

当前矩阵不被修改。

flipY()

令 result 为结果矩阵，其初始值设置为当前矩阵的各项值。
对 result 进行后乘，与 new DOMMatrix([1, 0, 0, -1, 0, 0]) 相乘。
返回 result。

当前矩阵不被修改。

inverse()

令 result 为结果矩阵，其初始值设置为当前矩阵的各项值。
对 result 执行一个 invertSelf() 变换。
返回 result。

当前矩阵不被修改。

下面的方法不会修改当前矩阵。

transformPoint(point)

令 pointObject 为调用从字典创建一个 DOMPoint（参数为 point）的结果。返回在给定 pointObject 与当前矩阵的情况下，调用用矩阵变换一个点的结果。传入的参数不会被修改。

toFloat32Array()

以列主序将当前矩阵的 16 个元素 m11 到 m44 序列化为一个 Float32Array 并返回。

toFloat64Array()

以列主序将当前矩阵的 16 个元素 m11 到 m44 序列化为一个 Float64Array 并返回。

字符串化行为

如果 m11 element 到 m44 element 中的一个或多个是非有限值，则抛出一个 "InvalidStateError" DOMException。

注：CSS 语法无法表示 NaN 或 Infinity 值。
令 string 为空字符串。
如果 is 2D 为 true，则：
1. 向 string 追加 "matrix("。
2. 向 string 追加 ! ToString(m11 element)。
3. 向 string 追加 ", "。
4. 向 string 追加 ! ToString(m12 element)。
5. 向 string 追加 ", "。
6. 向 string 追加 ! ToString(m21 element)。
7. 向 string 追加 ", "。
8. 向 string 追加 ! ToString(m22 element)。
9. 向 string 追加 ", "。
10. 向 string 追加 ! ToString(m41 element)。
11. 向 string 追加 ", "。
12. 向 string 追加 ! ToString(m42 element)。
13. 向 string 追加 ")"。
注：该字符串将以 CSS Transforms 的 <matrix()> 函数形式出现。 [CSS3-TRANSFORMS]
否则：
1. 向 string 追加 "matrix3d("。
2. 向 string 追加 ! ToString(m11 element)。
3. 向 string 追加 ", "。
4. 向 string 追加 ! ToString(m12 element)。
5. 向 string 追加 ", "。
6. 向 string 追加 ! ToString(m13 element)。
7. 向 string 追加 ", "。
8. 向 string 追加 ! ToString(m14 element)。
9. 向 string 追加 ", "。
10. 向 string 追加 ! ToString(m21 element)。
11. 向 string 追加 ", "。
12. 向 string 追加 ! ToString(m22 element)。
13. 向 string 追加 ", "。
14. 向 string 追加 ! ToString(m23 element)。
15. 向 string 追加 ", "。
16. 向 string 追加 ! ToString(m24 element)。
17. 向 string 追加 ", "。
18. 向 string 追加 ! ToString(m41 element)。
19. 向 string 追加 ", "。
20. 向 string 追加 ! ToString(m42 element)。
21. 向 string 追加 ", "。
22. 向 string 追加 ! ToString(m43 element)。
23. 向 string 追加 ", "。
24. 向 string 追加 ! ToString(m44 element)。
25. 向 string 追加 ")"。
注：该字符串将以 CSS Transforms 的 <matrix3d()> 函数形式出现。 [CSS3-TRANSFORMS]
返回 string。

在此示例中，创建了一个矩阵并调用了若干 2D 变换方法：

var matrix = new DOMMatrix();
matrix.scaleSelf(2);
matrix.translateSelf(20,20);
console.assert(matrix.toString() ===
                "matrix(2, 0, 0, 2, 40, 40)");

在下例中，创建了一个矩阵并调用了若干 3D 变换方法：

var matrix = new DOMMatrix();
matrix.scale3dSelf(2);
console.assert(matrix.toString() ===
                "matrix3d(2, 0, 0, 0, 0, 2, 0, 0, 0, 0, 2, 0, 0, 0, 0, 1)");

对于 3D 操作，字符串化器会返回表示 3D 矩阵的字符串。

该示例将抛出异常，因为矩阵中存在非有限值。

var matrix = new DOMMatrix([NaN, NaN, NaN, NaN, NaN, NaN, NaN, NaN, NaN, NaN, NaN, NaN, NaN, NaN, NaN, NaN]);
var string = matrix + " Batman!";

6.6. 可变的变换方法

下列方法会修改当前矩阵，因此每个方法都返回调用它的那个矩阵。这样做的主要好处是允许内容创作者链式调用方法。

下列代码示例：

var matrix = new DOMMatrix();
matrix.translateSelf(20, 20);
matrix.scaleSelf(2);
matrix.translateSelf(-20, -20);

等同于：

var matrix = new DOMMatrix();
matrix.translateSelf(20, 20).scaleSelf(2).translateSelf(-20, -20);

注：使用链式方法调用的作者建议使用可变变换方法，以避免在用户代理中创建中间 DOMMatrix 对象从而产生不必要的内存分配。

multiplySelf(other)

令 otherObject 为调用从字典创建一个 DOMMatrix（参数为 other）的结果。
将矩阵 otherObject 后乘到当前矩阵。
如果 otherObject 的 is 2D 为 false，则将当前矩阵的 is 2D 设为 false。
返回当前矩阵。

preMultiplySelf(other)

令 otherObject 为调用从字典创建一个 DOMMatrix（参数为 other）的结果。
将矩阵 otherObject 前乘到当前矩阵。
如果 otherObject 的 is 2D 为 false，则将当前矩阵的 is 2D 设为 false。
返回当前矩阵。

translateSelf(tx, ty, tz)

对当前矩阵执行一个平移变换（后乘）。3D 平移矩阵在 CSS Transforms 中有描述（参见链接）。 [CSS3-TRANSFORMS]
如果指定了 tz 且其不为 0 或 -0，则将当前矩阵的 is 2D 设为 false。
返回当前矩阵。

scaleSelf(scaleX, scaleY, scaleZ, originX, originY, originZ)

先对当前矩阵执行一个 translateSelf()，参数为 originX, originY, originZ（移动到原点）。
如果缺少 scaleY，将其设为 scaleX 的值。
将一个非均匀缩放（后乘）应用到当前矩阵。3D 缩放矩阵在 CSS Transforms 中有描述，使用 sx = scaleX, sy = scaleY, sz = scaleZ。 [CSS3-TRANSFORMS]
将 originX, originY, originZ 取反（回到原位置）。
对当前矩阵执行另一次 translateSelf()，参数为 originX, originY, originZ。
如果 scaleZ 不为 1 或 originZ 不为 0 或 -0，将当前矩阵的 is 2D 设为 false。
返回当前矩阵。

scale3dSelf(scale, originX, originY, originZ)

对当前矩阵应用一个 translateSelf()，参数为 originX, originY, originZ（移动到原点）。
后乘一个均匀 3D 缩放变换（即将 m11、m22、m33 设为 scale）到当前矩阵。3D 缩放矩阵在 CSS Transforms 中有描述，sx=sy=sz=scale。 [CSS3-TRANSFORMS]
对当前矩阵应用一个 translateSelf()，参数为 -originX, -originY, -originZ（移回原位置）。
如果 scale 不为 1，将当前矩阵的 is 2D 设为 false。
返回当前矩阵。

rotateSelf(rotX, rotY, rotZ)

如果 rotY 和 rotZ 都未提供，则将 rotZ 设为 rotX 的值，并把 rotX、rotY 设为 0。
如果 rotY 仍未提供，则将 rotY 设为 0。
如果 rotZ 仍未提供，则将 rotZ 设为 0。
如果 rotX 或 rotY 不为 0 或 -0，将当前矩阵的 is 2D 设为 false。
按顺序对当前矩阵后乘以下绕固定轴的旋转矩阵（均以度为单位）：先绕向量 (0,0,1) 旋转 rotZ，再绕向量 (0,1,0) 旋转 rotY，再绕向量 (1,0,0) 旋转 rotX。详见 CSS Transforms 中的 3D 旋转描述。 [CSS3-TRANSFORMS]
返回当前矩阵。

rotateFromVectorSelf(x, y)

对当前矩阵后乘一个旋转变换。旋转角度为向量 (1,0)^T 与 (x,y)^T 之间的夹角，按顺时针方向计算。如果 x 和 y 都为 0 或 -0，角度取 0。2D 旋转矩阵在 CSS Transforms 中有描述，使用 alpha 为该角度（度）。 [CSS3-TRANSFORMS]
返回当前矩阵。

rotateAxisAngleSelf(x, y, z, angle)

对当前矩阵后乘一个绕向量 (x, y, z) 的旋转矩阵，旋转角为 angle（度）。3D 旋转矩阵在 CSS Transforms 中有描述，alpha = angle（度）。 [CSS3-TRANSFORMS]
如果 x 或 y 不为 0 或 -0，将当前矩阵的 is 2D 设为 false。
返回当前矩阵。

skewXSelf(sx)

对当前矩阵后乘一个以度为单位的 skewX 变换（参数 sx）。2D skewX 矩阵在 CSS Transforms 中有描述。 [CSS3-TRANSFORMS]
返回当前矩阵。

skewYSelf(sy)

对当前矩阵后乘一个以度为单位的 skewY 变换（参数 sy）。2D skewY 矩阵在 CSS Transforms 中有描述。 [CSS3-TRANSFORMS]
返回当前矩阵。

invertSelf()

将当前矩阵取反（求逆）。
如果当前矩阵不可逆，则将所有属性设为 NaN，并将 is 2D 设为 false。
返回当前矩阵。

setMatrixValue(transformList)

将 transformList 解析为抽象矩阵，并令 matrix 与 2dTransform 为结果。如果结果为失败，则抛出一个 "SyntaxError" DOMException。
将 is 2D 设为 2dTransform 的值。
将 m11 element 到 m44 element 设为 matrix 的元素值，按列主序。
返回当前矩阵。

7. 结构化序列化

DOMPointReadOnly, DOMPoint, DOMRectReadOnly, DOMRect, DOMQuad, DOMMatrixReadOnly, 和 DOMMatrix 对象是可序列化对象。 [HTML]

针对 DOMPointReadOnly 和 DOMPoint 的序列化步骤（给定 value 与 serialized）为：

将 serialized.[[X]] 设为 value 的 x coordinate。
将 serialized.[[Y]] 设为 value 的 y coordinate。
将 serialized.[[Z]] 设为 value 的 z coordinate。
将 serialized.[[W]] 设为 value 的 w perspective。

它们的反序列化步骤（给定 serialized 与 value）为：

将 value 的 x coordinate 设为 serialized.[[X]]。
将 value 的 y coordinate 设为 serialized.[[Y]]。
将 value 的 z coordinate 设为 serialized.[[Z]]。
将 value 的 w perspective 设为 serialized.[[W]]。

针对 DOMRectReadOnly 和 DOMRect 的序列化步骤（给定 value 与 serialized）为：

将 serialized.[[X]] 设为 value 的 x coordinate。
将 serialized.[[Y]] 设为 value 的 y coordinate。
将 serialized.[[Width]] 设为 value 的 width dimension。
将 serialized.[[Height]] 设为 value 的 height dimension。

它们的反序列化步骤（给定 serialized 与 value）为：

将 value 的 x coordinate 设为 serialized.[[X]]。
将 value 的 y coordinate 设为 serialized.[[Y]]。
将 value 的 width dimension 设为 serialized.[[Width]]。
将 value 的 height dimension 设为 serialized.[[Height]]。

针对 DOMQuad 的序列化步骤（给定 value 与 serialized）为：

将 serialized.[[P1]] 设为 value 的子序列化的点 1。
将 serialized.[[P2]] 设为 value 的子序列化的点 2。
将 serialized.[[P3]] 设为 value 的子序列化的点 3。
将 serialized.[[P4]] 设为 value 的子序列化的点 4。

它们的反序列化步骤（给定 serialized 与 value）为：

将 value 的点 1 设为 serialized.[[P1]] 的子反序列化。
将 value 的点 2 设为 serialized.[[P2]] 的子反序列化。
将 value 的点 3 设为 serialized.[[P3]] 的子反序列化。
将 value 的点 4 设为 serialized.[[P4]] 的子反序列化。

针对 DOMMatrixReadOnly 与 DOMMatrix 的序列化步骤（给定 value 与 serialized）为：

如果 value 的 is 2D 为 true：
1. 将 serialized.[[M11]] 设为 value 的 m11 element。
2. 将 serialized.[[M12]] 设为 value 的 m12 element。
3. 将 serialized.[[M21]] 设为 value 的 m21 element。
4. 将 serialized.[[M22]] 设为 value 的 m22 element。
5. 将 serialized.[[M41]] 设为 value 的 m41 element。
6. 将 serialized.[[M42]] 设为 value 的 m42 element。
7. 将 serialized.[[Is2D]] 设为 true。
注：对于 2D 的 DOMMatrix 或 DOMMatrixReadOnly，某些元素（例如 m13 element）可能为 -0，这些值不会被此算法回传。
否则：
1. 将 serialized.[[M11]] 设为 value 的 m11 element。
2. 将 serialized.[[M12]] 设为 value 的 m12 element。
3. 将 serialized.[[M13]] 设为 value 的 m13 element。
4. 将 serialized.[[M14]] 设为 value 的 m14 element。
5. 将 serialized.[[M21]] 设为 value 的 m21 element。
6. 将 serialized.[[M22]] 设为 value 的 m22 element。
7. 将 serialized.[[M23]] 设为 value 的 m23 element。
8. 将 serialized.[[M24]] 设为 value 的 m24 element。
9. 将 serialized.[[M31]] 设为 value 的 m31 element。
10. 将 serialized.[[M32]] 设为 value 的 m32 element。
11. 将 serialized.[[M33]] 设为 value 的 m33 element。
12. 将 serialized.[[M34]] 设为 value 的 m34 element。
13. 将 serialized.[[M41]] 设为 value 的 m41 element。
14. 将 serialized.[[M42]] 设为 value 的 m42 element。
15. 将 serialized.[[M43]] 设为 value 的 m43 element。
16. 将 serialized.[[M44]] 设为 value 的 m44 element。
17. 将 serialized.[[Is2D]] 设为 false。
它们的反序列化步骤（给定 serialized 与 value）为：
1. 如果 serialized.[[Is2D]] 为 true：
  1. 将 value 的 m11 element 设为 serialized.[[M11]]。
  2. 将 value 的 m12 element 设为 serialized.[[M12]]。
  3. 将 value 的 m13 element 设为 0。
  4. 将 value 的 m14 element 设为 0。
  5. 将 value 的 m21 element 设为 serialized.[[M21]]。
  6. 将 value 的 m22 element 设为 serialized.[[M22]]。
  7. 将 value 的 m23 element 设为 0。
  8. 将 value 的 m24 element 设为 0。
  9. 将 value 的 m31 element 设为 0。
  10. 将 value 的 m32 element 设为 0。
  11. 将 value 的 m33 element 设为 1。
  12. 将 value 的 m34 element 设为 0。
  13. 将 value 的 m41 element 设为 serialized.[[M41]]。
  14. 将 value 的 m42 element 设为 serialized.[[M42]]。
  15. 将 value 的 m43 element 设为 0。
  16. 将 value 的 m44 element 设为 1。
  17. 将 value 的 is 2D 设为 true。
2. 否则：
  1. 将 value 的 m11 element 设为 serialized.[[M11]]。
  2. 将 value 的 m12 element 设为 serialized.[[M12]]。
  3. 将 value 的 m13 element 设为 serialized.[[M13]]。
  4. 将 value 的 m14 element 设为 serialized.[[M14]]。
  5. 将 value 的 m21 element 设为 serialized.[[M21]]。
  6. 将 value 的 m22 element 设为 serialized.[[M22]]。
  7. 将 value 的 m23 element 设为 serialized.[[M23]]。
  8. 将 value 的 m24 element 设为 serialized.[[M24]]。
  9. 将 value 的 m31 element 设为 serialized.[[M31]]。
  10. 将 value 的 m32 element 设为 serialized.[[M32]]。
  11. 将 value 的 m33 element 设为 serialized.[[M33]]。
  12. 将 value 的 m34 element 设为 serialized.[[M34]]。
  13. 将 value 的 m41 element 设为 serialized.[[M41]]。
  14. 将 value 的 m42 element 设为 serialized.[[M42]]。
  15. 将 value 的 m43 element 设为 serialized.[[M43]]。
  16. 将 value 的 m44 element 设为 serialized.[[M44]]。
  17. 将 value 的 is 2D 设为 false。

8. 隐私与安全注意事项

接口 DOMMatrix 与 DOMMatrixReadOnly 提供了使用 CSS 语法解析字符串的入口点。因此适用 CSS 语法规范中的隐私与安全注意事项。 [CSS3-SYNTAX]

该行为可能被用于利用用户代理中 CSS 解析器的漏洞。

本规范中定义的接口目前未发现其他已知的安全或隐私影响。然而，使用本规范中定义接口的其他规范与 API 可能会引入安全或隐私问题。

例如，CSSOM View 中定义的 getBoundingClientRect() API 返回一个 DOMRect，可用于测量包含某字体文本的内联元素的大小，这会泄露用户是否安装了该字体的信息。如果用来检测大量常见字体，这些信息可能成为可识别个人身份的信息。 [CSSOM-VIEW]

9. 历史记录

本节为非规范性内容。

本规范中的接口旨在取代早期规范中以及某些用户代理中专有实现的类似接口。本节试图列举这些接口。

9.1. CSSOM View

早期的 CSSOM View 修订版定义了 ClientRect 接口，该接口已被 DOMRect 取代。符合本规范的实现将不会支持 ClientRect。 [CSSOM-VIEW]

9.2. SVG

早期的 SVG 修订版定义了 SVGPoint、SVGRect、SVGMatrix，这些在本规范中被定义为别名，分别对应 DOMPoint、DOMRect、DOMMatrix。 [SVG11]

9.3. 非标准实现

一些用户代理曾支持 WebKitPoint 接口。符合本规范的实现将不会支持 WebKitPoint。

若干用户代理曾支持 WebKitCSSMatrix 接口，该接口在 Web 上也被广泛使用。本规范将其定义为 DOMMatrix 的别名。

一些用户代理曾支持 MSCSSMatrix 接口。符合本规范的实现将不会支持 MSCSSMatrix。

自上次发布以来的变更

本节为非规范性内容。

下列变更自 2014 年 11 月 25 日候选建议（Candidate Recommendation）以来已做出。

将接口改为通常使用特定的静态操作来进行构造，而不是使用重载构造函数，并使接口更加一致。但是，DOMMatrix 为了兼容 WebKitCSSMatrix 仍然使用重载构造函数。
引入了 DOMMatrixInit 字典。
增加了接口的 JSON 序列化器。
更改了 DOMMatrixReadOnly 与 DOMMatrix 以与 WebKitCSSMatrix 兼容：
- 将 rotate() 与 rotateSelf() 的参数从 (angle, originX, originY) 改为 (rotX, rotY, rotZ)。
- 将 scale() 与 scaleSelf() 方法更改为更类似先前的 scaleNonUniform()/scaleNonUniformSelf() 方法，并移除了 scaleNonUniformSelf() 方法。为兼容仍保留 scaleNonUniform()。
- 将 DOMMatrix 与 DOMMatrixReadOnly 的方法的所有参数设置为可选，除了 setMatrixValue()。
- 添加了无参构造函数。
- 将 WebKitCSSMatrix 定义为 DOMMatrix 的窗口层级的遗留别名。
在 Worker 环境中，DOMMatrix 与 DOMMatrixReadOnly 不支持使用 CSS 语法进行解析或字符串化。
定义了接口的结构化序列化（structured serialization）。
将 DOMQuad 上的实时属性 bounds 替换为非实时的 getBounds() 方法。并移除了“关联边界矩形”的概念。
将 DOMMatrix 与 DOMMatrixReadOnly 的字符串解析更改为使用 CSS 规则，而非 SVG 规则。
如果存在非有限值，DOMMatrix 与 DOMMatrixReadOnly 的字符串化器现在会抛出异常，否则使用 ToString 算法。 [ECMA-262]
在比较中将 0 与 -0 视为相等。
添加了 §8 隐私与安全注意事项与 §9 历史记录小节。

下列更改自 2014 年 9 月 18 日工作草案（Working Draft）以来已做出。

将 DOMPointReadOnly、 DOMPoint、 DOMRectReadOnly、 DOMRect、 DOMQuad、 DOMMatrixReadOnly 与 DOMMatrix 曝露给 Window 与 Worker。并定义了接口的克隆行为。

下列更改自 2014 年 6 月 26 日最后呼吁公开工作草案（Last Call Public Working Draft）以来已做出。

DOMPointReadOnly 增加了一个接受 4 个参数的构造函数。
DOMRectReadOnly 增加了一个接受 4 个参数的构造函数。
DOMMatrixReadOnly 增加了接受数值序列作为参数的构造函数。
DOMRectList 转为 ArrayClass。接口可用于遗留接口。
将 DOMRectList 标记为处于风险（at-Risk），等待浏览器反馈。
所有接口都以内部元素的形式描述，以便描述只读/可写与继承行为。
用 TypeError 异常替换了 IndexSizeError。

下列更改自 2014 年 5 月 22 日首次公开工作草案（First Public Working Draft）以来已做出。

将可变变换方法的后缀 *By 重命名为 *Self。（例如 translateBy() 被重命名为 translateSelf()。）
将 invert() 重命名为 invertSelf()。
增加了 setMatrixValue() 方法，该方法接受一个变换列表作为 DOMString。
is2D 与 isIdentity 现在为只读属性。
DOMMatrixReadOnly 被标记以跟踪 3D 变换与属性设置，从而维持 is2D。
invertSelf() 与 inverse() 不再抛出异常。

致谢

编辑者感谢 Robert O’Callahan 对本规范的贡献。非常感谢 Dean Jackson 最初提出 DOMMatrix 的建议。感谢 Adenilson Cavalcanti、 Benoit Jacob、 Boris Zbarsky、 Brian Birtles、 Cameron McCormack、 Domenic Denicola、 Kari Pihkala、 Max Vujovic、 Mike Taylor、 Peter Hall、 Philip Jägenstedt、 Simon Fraser、以及 Timothy Loh 对草案进行仔细审阅、评论和指正。

一致性要求

文档约定

一致性要求以描述性断言与 RFC 2119 术语的组合来表达。规范性部分中的关键词 “MUST”、 “MUST NOT”、 “REQUIRED”、 “SHALL”、 “SHALL NOT”、 “SHOULD”、 “SHOULD NOT”、 “RECOMMENDED”、 “MAY”、和 “OPTIONAL” 应按 RFC 2119 中的描述进行解释。但为易读起见，这些词在本规范中并不全部使用大写形式。

除非明确标注为非规范性、示例和注释外，本规范的全部文本均为规范性内容。 [RFC2119]

本规范中的示例以“例如”（for example）开头，或用 class="example" 与规范性文本区分，如下所示：

说明性注释以 “Note” 开头，并用 class="note" 与规范性文本区分，如下所示：

规范性的劝告段落以 <strong class="advisement"> 样式突出显示，例如： 用户代理必须提供可访问的替代方案。

一致性类别

样式表若要符合本规范，需满足其中使用的本模块定义语法均对通用 CSS 文法和各特性独立文法而言是有效的。

渲染器若要符合本规范，除按相应规范解释样式表外，还应通过正确解析并呈现文档来支持本规范定义的所有特性。但由于设备限制导致渲染器无法完全正确呈现文档并不视为不符合规范。（例如，单色显示器上不要求渲染颜色。）

创作工具若要符合本规范，应能编写语法上符合通用 CSS 文法与本模块各特性文法的样式表，并满足本模块对样式表的一切其他一致性要求。

负责任实现 CSS 的要求

下列小节定义了若干实现 CSS 的一致性要求，以促进当前与未来的互操作性。

部分实现

为了让作者利用向前兼容的解析规则指定回退值，CSS 渲染器必须将其不具备可用支持级别的 at-rule、属性、属性值、关键字和其他语法结构视为无效（并在适当时忽略）。特别地，用户代理不得在单个多值属性声明中选择性地忽略不支持的属性值而保留支持的值：如果存在任何值被视为无效（不支持的值应视为无效），则整个声明必须被忽略。

不稳定与专有特性的实现

CR 级别特性的实现

当规范达到候选建议（Candidate Recommendation）阶段时，实现者应发布任何其能根据规范证明已正确实现的 CR 级别特性的非前缀（unprefixed）实现，并应避免公开该特性的带前缀变体。

为建立并维持跨实现的互操作性，CSS 工作组要求非实验性的 CSS 渲染器在发布任何能通过规范验证的非前缀实现之前，向 W3C 提交实现报告（如有必要，还应提交用于该实现报告的测试用例）。提交给 W3C 的测试用例将接受 CSS 工作组的审查与修正。

CR 退出标准

若要将本规范提升为拟议推荐（Proposed Recommendation），每项特性必须至少有两个独立且可互操作的实现。每项特性的实现可以由不同产品实现，不要求所有特性由同一产品实现。为此标准我们定义如下术语：

本规范将至少以候选建议阶段（Candidate Recommendation）状态维持六个月。

几何接口模块 1 级

W3C 候选推荐，2018 年 12 月 4 日

摘要

本文档状态

1. 简介

2. DOMPoint 接口

2.1. 用矩阵变换点

3. DOMRect 接口

4. DOMRectList 接口

5. DOMQuad 接口

6. DOMMatrix 接口

6.1. DOMMatrix2DInit 和 DOMMatrixInit 字典

6.2. 将字符串解析为抽象矩阵

6.3. 创建 DOMMatrixReadOnly 和 DOMMatrix 对象

6.4. DOMMatrix 属性

6.5. 不可变的变换方法

6.6. 可变的变换方法

7. 结构化序列化

8. 隐私与安全注意事项

9. 历史记录

9.1. CSSOM View

9.2. SVG

9.3. 非标准实现

自上次发布以来的变更

致谢

一致性要求

文档约定

一致性类别

负责任实现 CSS 的要求

部分实现

不稳定与专有特性的实现

CR 级别特性的实现

CR 退出标准

索引

本规范定义的术语

通过引用定义的术语

参考文献

规范性参考文献

信息性引用

IDL 索引