0
# Math & Geometry
1

2
2D mathematics utilities including points, rectangles, matrices, and geometric shapes for spatial calculations. PixiJS provides comprehensive math classes for handling positioning, transformations, and collision detection.
3

4
## Capabilities
5

6
### Point Classes
7

8
2D point representation with various functionality.
9

10
```typescript { .api }
11
/**
12
 * 2D point with x and y coordinates
13
 */
14
class Point implements IPointData {
15
    x: number;
16
    y: number;
17
    
18
    constructor(x?: number, y?: number);
19
    
20
    /** Clone point */
21
    clone(): Point;
22
    
23
    /** Copy from another point */
24
    copyFrom(p: IPointData): this;
25
    
26
    /** Copy to another point */
27
    copyTo<T extends IPoint>(p: T): T;
28
    
29
    /** Check equality */
30
    equals(p: IPointData): boolean;
31
    
32
    /** Set coordinates */
33
    set(x?: number, y?: number): this;
34
}
35

36
/**
37
 * Observable point that emits change events
38
 */
39
class ObservablePoint implements IPointData {
40
    x: number;
41
    y: number;
42
    
43
    constructor(x?: number, y?: number, observer?: () => void);
44
    
45
    /** Set coordinates */
46
    set(x?: number, y?: number): this;
47
    
48
    /** Copy from another point */
49
    copyFrom(p: IPointData): this;
50
    
51
    /** Copy to another point */
52
    copyTo<T extends IPoint>(p: T): T;
53
    
54
    /** Check equality */
55
    equals(p: IPointData): boolean;
56
    
57
    /** Clone point */
58
    clone(): ObservablePoint;
59
}
60

61
interface IPointData {
62
    x: number;
63
    y: number;
64
}
65

66
interface IPoint extends IPointData {
67
    copyFrom(p: IPointData): this;
68
    copyTo<T extends IPoint>(p: T): T;
69
    equals(p: IPointData): boolean;
70
    set(x?: number, y?: number): this;
71
}
72
```
73

74
### Rectangle
75

76
Axis-aligned bounding box representation.
77

78
```typescript { .api }
79
/**
80
 * Rectangle with position and dimensions
81
 */
82
class Rectangle {
83
    x: number;
84
    y: number;
85
    width: number;
86
    height: number;
87
    
88
    constructor(x?: number, y?: number, width?: number, height?: number);
89
    
90
    /** Left edge */
91
    get left(): number;
92
    
93
    /** Right edge */
94
    get right(): number;
95
    
96
    /** Top edge */
97
    get top(): number;
98
    
99
    /** Bottom edge */
100
    get bottom(): number;
101
    
102
    /** Clone rectangle */
103
    clone(): Rectangle;
104
    
105
    /** Copy from another rectangle */
106
    copyFrom(rectangle: Rectangle): Rectangle;
107
    
108
    /** Copy to another rectangle */
109
    copyTo(rectangle: Rectangle): Rectangle;
110
    
111
    /** Check if point is inside */
112
    contains(x: number, y: number): boolean;
113
    
114
    /** Check intersection with another rectangle */
115
    intersects(other: Rectangle): boolean;
116
    
117
    /** Enlarge to include point */
118
    enlarge(rectangle: Rectangle): void;
119
    
120
    /** Fit rectangle inside another */
121
    fit(rectangle: Rectangle): void;
122
    
123
    /** Add padding */
124
    pad(paddingX: number, paddingY?: number): this;
125
    
126
    /** Check if rectangles are equal */
127
    equals(rect: Rectangle): boolean;
128
    
129
    /** Check if rectangle is empty */
130
    isEmpty(): boolean;
131
}
132
```
133

134
### Matrix
135

136
2D transformation matrix for handling rotations, scaling, and translations.
137

138
```typescript { .api }
139
/**
140
 * 2D transformation matrix
141
 */
142
class Matrix {
143
    a: number; // Scale X
144
    b: number; // Skew Y
145
    c: number; // Skew X
146
    d: number; // Scale Y
147
    tx: number; // Translate X
148
    ty: number; // Translate Y
149
    
150
    constructor(a?: number, b?: number, c?: number, d?: number, tx?: number, ty?: number);
151
    
152
    /** Create identity matrix */
153
    identity(): this;
154
    
155
    /** Clone matrix */
156
    clone(): Matrix;
157
    
158
    /** Copy from another matrix */
159
    copyFrom(matrix: Matrix): this;
160
    
161
    /** Copy to another matrix */
162
    copyTo(matrix: Matrix): Matrix;
163
    
164
    /** Set values */
165
    set(a: number, b: number, c: number, d: number, tx: number, ty: number): this;
166
    
167
    /**
168
     * Apply transformation to point
169
     * @param pos - Input point
170
     * @param newPos - Output point
171
     */
172
    apply(pos: IPointData, newPos?: Point): Point;
173
    
174
    /**
175
     * Apply inverse transformation
176
     * @param pos - Input point
177
     * @param newPos - Output point
178
     */
179
    applyInverse(pos: IPointData, newPos?: Point): Point;
180
    
181
    /** Translate matrix */
182
    translate(x: number, y: number): this;
183
    
184
    /** Scale matrix */
185
    scale(x: number, y: number): this;
186
    
187
    /** Rotate matrix */
188
    rotate(angle: number): this;
189
    
190
    /** Append matrix */
191
    append(matrix: Matrix): this;
192
    
193
    /** Prepend matrix */
194
    prepend(matrix: Matrix): this;
195
    
196
    /** Invert matrix */
197
    invert(): this;
198
    
199
    /** Decompose matrix */
200
    decompose(transform: Transform): Transform;
201
}
202
```
203

204
**Usage Examples:**
205

206
```typescript
207
import { Point, Rectangle, Matrix } from "pixi.js";
208

209
// Working with points
210
const point1 = new Point(10, 20);
211
const point2 = new Point(30, 40);
212

213
console.log(point1.equals(point2)); // false
214

215
// Rectangle operations
216
const rect1 = new Rectangle(0, 0, 100, 100);
217
const rect2 = new Rectangle(50, 50, 100, 100);
218

219
console.log(rect1.intersects(rect2)); // true
220
console.log(rect1.contains(25, 25)); // true
221

222
// Matrix transformations
223
const matrix = new Matrix();
224
matrix.translate(100, 50);
225
matrix.rotate(Math.PI / 4); // 45 degrees
226
matrix.scale(2, 2);
227

228
const transformedPoint = matrix.apply(new Point(0, 0));
229
console.log(transformedPoint); // Transformed coordinates
230
```