@ue-too/board
Version:
115 lines (114 loc) • 2.79 kB
TypeScript
/**
* @description The transform matrix for the camera.
* It's in the format like this:
* ```
* | a c e |
* | b d f |
* | 0 0 1 |
* ```
*
* @category Camera
*/
export type TransformationMatrix = {
a: number;
b: number;
c: number;
d: number;
e: number;
f: number;
};
/**
* Decomposes a camera transformation matrix back to camera parameters
*
* Transformation order:
* 1. Scale by device pixel ratio
* 2. Translate to canvas center
* 3. Rotate by -camera.rotation
* 4. Scale by zoom level
* 5. Translate by -camera.position
*
* Final matrix: M = S1 * T1 * R * S2 * T2
*/
export declare function decomposeCameraMatrix(transformMatrix: TransformationMatrix, devicePixelRatio: number, canvasWidth: number, canvasHeight: number): {
position: {
x: number;
y: number;
};
zoom: number;
rotation: number;
};
export declare function createCameraMatrix(cameraPos: {
x: number;
y: number;
}, zoom: number, rotation: number, devicePixelRatio: number, canvasWidth: number, canvasHeight: number): {
a: number;
b: number;
c: number;
d: number;
e: number;
f: number;
};
export declare function multiplyMatrix(m1: TransformationMatrix, m2: TransformationMatrix): {
a: number;
b: number;
c: number;
d: number;
e: number;
f: number;
};
/**
* Decomposes a 2D transformation matrix into Translation, Rotation, and Scale (TRS)
*
* @param matrix - The transformation matrix to decompose
* @returns Object containing translation, rotation (in radians), and scale components
*
* @category Matrix
*/
export declare function decomposeTRS(matrix: TransformationMatrix): {
translation: {
x: number;
y: number;
};
rotation: number;
scale: {
x: number;
y: number;
};
};
/**
* Creates a transformation matrix from TRS components
*
* @param translation - Translation vector
* @param rotation - Rotation in radians
* @param scale - Scale vector
* @returns Transformation matrix
*
* @category Matrix
*/
export declare function createTRSMatrix(translation: {
x: number;
y: number;
}, rotation: number, scale: {
x: number;
y: number;
}): TransformationMatrix;
/**
* Decomposes a matrix using SVD (Singular Value Decomposition) approach
* This is an alternative method that can handle more complex transformations
*
* @param matrix - The transformation matrix to decompose
* @returns Object containing translation, rotation, and scale components
*
* @category Matrix
*/
export declare function decomposeTRSSVD(matrix: TransformationMatrix): {
translation: {
x: number;
y: number;
};
rotation: number;
scale: {
x: number;
y: number;
};
};