@js-draw/math 1.19.0 → 1.21.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/LICENSE CHANGED
@@ -1,6 +1,6 @@
1
1
  MIT License
2
2
 
3
- Copyright (c) 2023 Henry Heino
3
+ Copyright (c) 2023-2024 Henry Heino
4
4
 
5
5
  Permission is hereby granted, free of charge, to any person obtaining a copy
6
6
  of this software and associated documentation files (the "Software"), to deal
@@ -1,5 +1,8 @@
1
1
  import { Point2, Vec2 } from './Vec2';
2
2
  import Vec3 from './Vec3';
3
+ /**
4
+ * See {@link Mat33.toArray}.
5
+ */
3
6
  export type Mat33Array = [
4
7
  number,
5
8
  number,
@@ -15,6 +18,46 @@ export type Mat33Array = [
15
18
  * Represents a three dimensional linear transformation or
16
19
  * a two-dimensional affine transformation. (An affine transformation scales/rotates/shears
17
20
  * **and** translates while a linear transformation just scales/rotates/shears).
21
+ *
22
+ * In addition to other matrices, {@link Mat33}s can be used to transform {@link Vec3}s and {@link Vec2}s.
23
+ *
24
+ * For example, to move the point $(1, 1)$ by 5 units to the left and 6 units up,
25
+ * ```ts,runnable,console
26
+ * import {Mat33, Vec2} from '@js-draw/math';
27
+ *
28
+ * const moveLeftAndUp = Mat33.translation(Vec2.of(5, 6));
29
+ * console.log(moveLeftAndUp);
30
+ * ```
31
+ *
32
+ * This `moveLeftAndUp` matrix could then translate (move) a {@link Vec2} using
33
+ * {@link Mat33.transformVec2}:
34
+ *
35
+ * ```ts,runnable,console
36
+ * ---use-previous---
37
+ * ---visible---
38
+ * console.log(moveLeftAndUp.transformVec2(Vec2.of(1, 1)));
39
+ * console.log(moveLeftAndUp.transformVec2(Vec2.of(-1, 2)));
40
+ * ```
41
+ *
42
+ * It's also possible to create transformation matrices that scale and rotate.
43
+ * A single transform matrix can be created from multiple using matrix multiplication
44
+ * (see {@link Mat33.rightMul}):
45
+ *
46
+ * ```ts,runnable,console
47
+ * ---use-previous---
48
+ * ---visible---
49
+ * // Create a matrix by right multiplying.
50
+ * const scaleThenRotate =
51
+ * // The resultant matrix first scales by a factor of two
52
+ * Mat33.scaling2D(2).rightMul(
53
+ * // ...then rotates by pi/2 radians = 90 degrees.
54
+ * Mat33.zRotation(Math.PI / 2)
55
+ * );
56
+ * console.log(scaleThenRotate);
57
+ *
58
+ * // Use scaleThenRotate to scale then rotate a vector.
59
+ * console.log(scaleThenRotate.transformVec2(Vec2.unitX));
60
+ * ```
18
61
  */
19
62
  export declare class Mat33 {
20
63
  readonly a1: number;
@@ -36,6 +79,9 @@ export declare class Mat33 {
36
79
  * c1 & c2 & c3
37
80
  * \end{bmatrix}
38
81
  * $$
82
+ *
83
+ * Static constructor methods are also available.
84
+ * See {@link Mat33.scaling2D}, {@link Mat33.zRotation}, {@link Mat33.translation}, and {@link Mat33.fromCSSMatrix}.
39
85
  */
40
86
  constructor(a1: number, a2: number, a3: number, b1: number, b2: number, b3: number, c1: number, c2: number, c3: number);
41
87
  /**
@@ -49,6 +95,7 @@ export declare class Mat33 {
49
95
  * $$
50
96
  */
51
97
  static ofRows(r1: Vec3, r2: Vec3, r3: Vec3): Mat33;
98
+ /** The 3x3 [identity matrix](https://en.wikipedia.org/wiki/Identity_matrix). */
52
99
  static identity: Mat33;
53
100
  /**
54
101
  * Either returns the inverse of this, or, if this matrix is singular/uninvertable,
@@ -62,6 +109,29 @@ export declare class Mat33 {
62
109
  private cachedInverse;
63
110
  private computeInverse;
64
111
  transposed(): Mat33;
112
+ /**
113
+ * [Right-multiplies](https://en.wikipedia.org/wiki/Matrix_multiplication) this by `other`.
114
+ *
115
+ * See also {@link transformVec3} and {@link transformVec2}.
116
+ *
117
+ * Example:
118
+ * ```ts,runnable,console
119
+ * import {Mat33, Vec2} from '@js-draw/math';
120
+ * console.log(Mat33.identity.rightMul(Mat33.identity));
121
+ *
122
+ * // Create a matrix by right multiplying.
123
+ * const scaleThenRotate =
124
+ * // The resultant matrix first scales by a factor of two
125
+ * Mat33.scaling2D(2).rightMul(
126
+ * // ...then rotates by pi/4 radians = 45 degrees.
127
+ * Mat33.zRotation(Math.PI / 4)
128
+ * );
129
+ * console.log(scaleThenRotate);
130
+ *
131
+ * // Use scaleThenRotate to scale then rotate a vector.
132
+ * console.log(scaleThenRotate.transformVec2(Vec2.unitX));
133
+ * ```
134
+ */
65
135
  rightMul(other: Mat33): Mat33;
66
136
  /**
67
137
  * Applies this as an **affine** transformation to the given vector.
@@ -79,6 +149,15 @@ export declare class Mat33 {
79
149
  isIdentity(): boolean;
80
150
  /** Returns true iff this = other ± fuzz */
81
151
  eq(other: Mat33, fuzz?: number): boolean;
152
+ /**
153
+ * Creates a human-readable representation of the matrix.
154
+ *
155
+ * Example:
156
+ * ```ts,runnable,console
157
+ * import { Mat33 } from '@js-draw/math';
158
+ * console.log(Mat33.identity.toString());
159
+ * ```
160
+ */
82
161
  toString(): string;
83
162
  /**
84
163
  * ```
@@ -86,6 +165,18 @@ export declare class Mat33 {
86
165
  * result[1] = element at row zero, column 1
87
166
  * ...
88
167
  * ```
168
+ *
169
+ * Example:
170
+ * ```ts,runnable,console
171
+ * import { Mat33 } from '@js-draw/math';
172
+ * console.log(
173
+ * new Mat33(
174
+ * 1, 2, 3,
175
+ * 4, 5, 6,
176
+ * 7, 8, 9,
177
+ * )
178
+ * );
179
+ * ```
89
180
  */
90
181
  toArray(): Mat33Array;
91
182
  /**
package/dist/cjs/Mat33.js CHANGED
@@ -10,6 +10,46 @@ const Vec3_1 = __importDefault(require("./Vec3"));
10
10
  * Represents a three dimensional linear transformation or
11
11
  * a two-dimensional affine transformation. (An affine transformation scales/rotates/shears
12
12
  * **and** translates while a linear transformation just scales/rotates/shears).
13
+ *
14
+ * In addition to other matrices, {@link Mat33}s can be used to transform {@link Vec3}s and {@link Vec2}s.
15
+ *
16
+ * For example, to move the point $(1, 1)$ by 5 units to the left and 6 units up,
17
+ * ```ts,runnable,console
18
+ * import {Mat33, Vec2} from '@js-draw/math';
19
+ *
20
+ * const moveLeftAndUp = Mat33.translation(Vec2.of(5, 6));
21
+ * console.log(moveLeftAndUp);
22
+ * ```
23
+ *
24
+ * This `moveLeftAndUp` matrix could then translate (move) a {@link Vec2} using
25
+ * {@link Mat33.transformVec2}:
26
+ *
27
+ * ```ts,runnable,console
28
+ * ---use-previous---
29
+ * ---visible---
30
+ * console.log(moveLeftAndUp.transformVec2(Vec2.of(1, 1)));
31
+ * console.log(moveLeftAndUp.transformVec2(Vec2.of(-1, 2)));
32
+ * ```
33
+ *
34
+ * It's also possible to create transformation matrices that scale and rotate.
35
+ * A single transform matrix can be created from multiple using matrix multiplication
36
+ * (see {@link Mat33.rightMul}):
37
+ *
38
+ * ```ts,runnable,console
39
+ * ---use-previous---
40
+ * ---visible---
41
+ * // Create a matrix by right multiplying.
42
+ * const scaleThenRotate =
43
+ * // The resultant matrix first scales by a factor of two
44
+ * Mat33.scaling2D(2).rightMul(
45
+ * // ...then rotates by pi/2 radians = 90 degrees.
46
+ * Mat33.zRotation(Math.PI / 2)
47
+ * );
48
+ * console.log(scaleThenRotate);
49
+ *
50
+ * // Use scaleThenRotate to scale then rotate a vector.
51
+ * console.log(scaleThenRotate.transformVec2(Vec2.unitX));
52
+ * ```
13
53
  */
14
54
  class Mat33 {
15
55
  /**
@@ -21,6 +61,9 @@ class Mat33 {
21
61
  * c1 & c2 & c3
22
62
  * \end{bmatrix}
23
63
  * $$
64
+ *
65
+ * Static constructor methods are also available.
66
+ * See {@link Mat33.scaling2D}, {@link Mat33.zRotation}, {@link Mat33.translation}, and {@link Mat33.fromCSSMatrix}.
24
67
  */
25
68
  constructor(a1, a2, a3, b1, b2, b3, c1, c2, c3) {
26
69
  this.a1 = a1;
@@ -131,6 +174,29 @@ class Mat33 {
131
174
  transposed() {
132
175
  return new Mat33(this.a1, this.b1, this.c1, this.a2, this.b2, this.c2, this.a3, this.b3, this.c3);
133
176
  }
177
+ /**
178
+ * [Right-multiplies](https://en.wikipedia.org/wiki/Matrix_multiplication) this by `other`.
179
+ *
180
+ * See also {@link transformVec3} and {@link transformVec2}.
181
+ *
182
+ * Example:
183
+ * ```ts,runnable,console
184
+ * import {Mat33, Vec2} from '@js-draw/math';
185
+ * console.log(Mat33.identity.rightMul(Mat33.identity));
186
+ *
187
+ * // Create a matrix by right multiplying.
188
+ * const scaleThenRotate =
189
+ * // The resultant matrix first scales by a factor of two
190
+ * Mat33.scaling2D(2).rightMul(
191
+ * // ...then rotates by pi/4 radians = 45 degrees.
192
+ * Mat33.zRotation(Math.PI / 4)
193
+ * );
194
+ * console.log(scaleThenRotate);
195
+ *
196
+ * // Use scaleThenRotate to scale then rotate a vector.
197
+ * console.log(scaleThenRotate.transformVec2(Vec2.unitX));
198
+ * ```
199
+ */
134
200
  rightMul(other) {
135
201
  other = other.transposed();
136
202
  const at = (row, col) => {
@@ -180,6 +246,15 @@ class Mat33 {
180
246
  }
181
247
  return true;
182
248
  }
249
+ /**
250
+ * Creates a human-readable representation of the matrix.
251
+ *
252
+ * Example:
253
+ * ```ts,runnable,console
254
+ * import { Mat33 } from '@js-draw/math';
255
+ * console.log(Mat33.identity.toString());
256
+ * ```
257
+ */
183
258
  toString() {
184
259
  let result = '';
185
260
  const maxColumnLens = [0, 0, 0];
@@ -228,6 +303,18 @@ class Mat33 {
228
303
  * result[1] = element at row zero, column 1
229
304
  * ...
230
305
  * ```
306
+ *
307
+ * Example:
308
+ * ```ts,runnable,console
309
+ * import { Mat33 } from '@js-draw/math';
310
+ * console.log(
311
+ * new Mat33(
312
+ * 1, 2, 3,
313
+ * 4, 5, 6,
314
+ * 7, 8, 9,
315
+ * )
316
+ * );
317
+ * ```
231
318
  */
232
319
  toArray() {
233
320
  return [
@@ -436,5 +523,6 @@ class Mat33 {
436
523
  }
437
524
  }
438
525
  exports.Mat33 = Mat33;
526
+ /** The 3x3 [identity matrix](https://en.wikipedia.org/wiki/Identity_matrix). */
439
527
  Mat33.identity = new Mat33(1, 0, 0, 0, 1, 0, 0, 0, 1);
440
528
  exports.default = Mat33;
@@ -7,7 +7,18 @@ interface IntersectionResult {
7
7
  point: Point2;
8
8
  t: number;
9
9
  }
10
- /** Represents a line segment. A `LineSegment2` is immutable. */
10
+ /**
11
+ * Represents a line segment. A `LineSegment2` is immutable.
12
+ *
13
+ * @example
14
+ * ```ts,runnable,console
15
+ * import {LineSegment2, Vec2} from '@js-draw/math';
16
+ * const l = new LineSegment2(Vec2.of(1, 1), Vec2.of(2, 2));
17
+ * console.log('length: ', l.length);
18
+ * console.log('direction: ', l.direction);
19
+ * console.log('bounding box: ', l.bbox);
20
+ * ```
21
+ */
11
22
  export declare class LineSegment2 extends Parameterized2DShape {
12
23
  private readonly point1;
13
24
  private readonly point2;
@@ -30,7 +41,7 @@ export declare class LineSegment2 extends Parameterized2DShape {
30
41
  * if no such line segment exists.
31
42
  *
32
43
  * @example
33
- * ```ts,runnable
44
+ * ```ts,runnable,console
34
45
  * import {LineSegment2, Vec2} from '@js-draw/math';
35
46
  * console.log(LineSegment2.ofSmallestContainingPoints([Vec2.of(1, 0), Vec2.of(0, 1)]));
36
47
  * ```
@@ -7,7 +7,18 @@ exports.LineSegment2 = void 0;
7
7
  const Rect2_1 = __importDefault(require("./Rect2"));
8
8
  const Vec2_1 = require("../Vec2");
9
9
  const Parameterized2DShape_1 = __importDefault(require("./Parameterized2DShape"));
10
- /** Represents a line segment. A `LineSegment2` is immutable. */
10
+ /**
11
+ * Represents a line segment. A `LineSegment2` is immutable.
12
+ *
13
+ * @example
14
+ * ```ts,runnable,console
15
+ * import {LineSegment2, Vec2} from '@js-draw/math';
16
+ * const l = new LineSegment2(Vec2.of(1, 1), Vec2.of(2, 2));
17
+ * console.log('length: ', l.length);
18
+ * console.log('direction: ', l.direction);
19
+ * console.log('bounding box: ', l.bbox);
20
+ * ```
21
+ */
11
22
  class LineSegment2 extends Parameterized2DShape_1.default {
12
23
  /** Creates a new `LineSegment2` from its endpoints. */
13
24
  constructor(point1, point2) {
@@ -27,7 +38,7 @@ class LineSegment2 extends Parameterized2DShape_1.default {
27
38
  * if no such line segment exists.
28
39
  *
29
40
  * @example
30
- * ```ts,runnable
41
+ * ```ts,runnable,console
31
42
  * import {LineSegment2, Vec2} from '@js-draw/math';
32
43
  * console.log(LineSegment2.ofSmallestContainingPoints([Vec2.of(1, 0), Vec2.of(0, 1)]));
33
44
  * ```
@@ -41,7 +41,7 @@ declare class PointShape2D extends Parameterized2DShape {
41
41
  minus(v: Vec3): Vec3;
42
42
  dot(other: Vec3): number;
43
43
  cross(other: Vec3): Vec3;
44
- scale(other: number | Vec3): Vec3;
44
+ scale(other: Vec3 | number): Vec3;
45
45
  orthog(): Vec3;
46
46
  extend(distance: number, direction: Vec3): Vec3;
47
47
  lerp(target: Vec3, fractionTo: number): Vec3;
@@ -80,7 +80,7 @@ export declare class Rect2 extends Abstract2DShape {
80
80
  minus(v: Vec3): Vec3;
81
81
  dot(other: Vec3): number;
82
82
  cross(other: Vec3): Vec3;
83
- scale(other: number | Vec3): Vec3;
83
+ scale(other: Vec3 | number): Vec3;
84
84
  orthog(): Vec3;
85
85
  extend(distance: number, direction: Vec3): Vec3;
86
86
  lerp(target: Vec3, fractionTo: number): Vec3;
@@ -1,5 +1,8 @@
1
1
  import { Point2, Vec2 } from './Vec2';
2
2
  import Vec3 from './Vec3';
3
+ /**
4
+ * See {@link Mat33.toArray}.
5
+ */
3
6
  export type Mat33Array = [
4
7
  number,
5
8
  number,
@@ -15,6 +18,46 @@ export type Mat33Array = [
15
18
  * Represents a three dimensional linear transformation or
16
19
  * a two-dimensional affine transformation. (An affine transformation scales/rotates/shears
17
20
  * **and** translates while a linear transformation just scales/rotates/shears).
21
+ *
22
+ * In addition to other matrices, {@link Mat33}s can be used to transform {@link Vec3}s and {@link Vec2}s.
23
+ *
24
+ * For example, to move the point $(1, 1)$ by 5 units to the left and 6 units up,
25
+ * ```ts,runnable,console
26
+ * import {Mat33, Vec2} from '@js-draw/math';
27
+ *
28
+ * const moveLeftAndUp = Mat33.translation(Vec2.of(5, 6));
29
+ * console.log(moveLeftAndUp);
30
+ * ```
31
+ *
32
+ * This `moveLeftAndUp` matrix could then translate (move) a {@link Vec2} using
33
+ * {@link Mat33.transformVec2}:
34
+ *
35
+ * ```ts,runnable,console
36
+ * ---use-previous---
37
+ * ---visible---
38
+ * console.log(moveLeftAndUp.transformVec2(Vec2.of(1, 1)));
39
+ * console.log(moveLeftAndUp.transformVec2(Vec2.of(-1, 2)));
40
+ * ```
41
+ *
42
+ * It's also possible to create transformation matrices that scale and rotate.
43
+ * A single transform matrix can be created from multiple using matrix multiplication
44
+ * (see {@link Mat33.rightMul}):
45
+ *
46
+ * ```ts,runnable,console
47
+ * ---use-previous---
48
+ * ---visible---
49
+ * // Create a matrix by right multiplying.
50
+ * const scaleThenRotate =
51
+ * // The resultant matrix first scales by a factor of two
52
+ * Mat33.scaling2D(2).rightMul(
53
+ * // ...then rotates by pi/2 radians = 90 degrees.
54
+ * Mat33.zRotation(Math.PI / 2)
55
+ * );
56
+ * console.log(scaleThenRotate);
57
+ *
58
+ * // Use scaleThenRotate to scale then rotate a vector.
59
+ * console.log(scaleThenRotate.transformVec2(Vec2.unitX));
60
+ * ```
18
61
  */
19
62
  export declare class Mat33 {
20
63
  readonly a1: number;
@@ -36,6 +79,9 @@ export declare class Mat33 {
36
79
  * c1 & c2 & c3
37
80
  * \end{bmatrix}
38
81
  * $$
82
+ *
83
+ * Static constructor methods are also available.
84
+ * See {@link Mat33.scaling2D}, {@link Mat33.zRotation}, {@link Mat33.translation}, and {@link Mat33.fromCSSMatrix}.
39
85
  */
40
86
  constructor(a1: number, a2: number, a3: number, b1: number, b2: number, b3: number, c1: number, c2: number, c3: number);
41
87
  /**
@@ -49,6 +95,7 @@ export declare class Mat33 {
49
95
  * $$
50
96
  */
51
97
  static ofRows(r1: Vec3, r2: Vec3, r3: Vec3): Mat33;
98
+ /** The 3x3 [identity matrix](https://en.wikipedia.org/wiki/Identity_matrix). */
52
99
  static identity: Mat33;
53
100
  /**
54
101
  * Either returns the inverse of this, or, if this matrix is singular/uninvertable,
@@ -62,6 +109,29 @@ export declare class Mat33 {
62
109
  private cachedInverse;
63
110
  private computeInverse;
64
111
  transposed(): Mat33;
112
+ /**
113
+ * [Right-multiplies](https://en.wikipedia.org/wiki/Matrix_multiplication) this by `other`.
114
+ *
115
+ * See also {@link transformVec3} and {@link transformVec2}.
116
+ *
117
+ * Example:
118
+ * ```ts,runnable,console
119
+ * import {Mat33, Vec2} from '@js-draw/math';
120
+ * console.log(Mat33.identity.rightMul(Mat33.identity));
121
+ *
122
+ * // Create a matrix by right multiplying.
123
+ * const scaleThenRotate =
124
+ * // The resultant matrix first scales by a factor of two
125
+ * Mat33.scaling2D(2).rightMul(
126
+ * // ...then rotates by pi/4 radians = 45 degrees.
127
+ * Mat33.zRotation(Math.PI / 4)
128
+ * );
129
+ * console.log(scaleThenRotate);
130
+ *
131
+ * // Use scaleThenRotate to scale then rotate a vector.
132
+ * console.log(scaleThenRotate.transformVec2(Vec2.unitX));
133
+ * ```
134
+ */
65
135
  rightMul(other: Mat33): Mat33;
66
136
  /**
67
137
  * Applies this as an **affine** transformation to the given vector.
@@ -79,6 +149,15 @@ export declare class Mat33 {
79
149
  isIdentity(): boolean;
80
150
  /** Returns true iff this = other ± fuzz */
81
151
  eq(other: Mat33, fuzz?: number): boolean;
152
+ /**
153
+ * Creates a human-readable representation of the matrix.
154
+ *
155
+ * Example:
156
+ * ```ts,runnable,console
157
+ * import { Mat33 } from '@js-draw/math';
158
+ * console.log(Mat33.identity.toString());
159
+ * ```
160
+ */
82
161
  toString(): string;
83
162
  /**
84
163
  * ```
@@ -86,6 +165,18 @@ export declare class Mat33 {
86
165
  * result[1] = element at row zero, column 1
87
166
  * ...
88
167
  * ```
168
+ *
169
+ * Example:
170
+ * ```ts,runnable,console
171
+ * import { Mat33 } from '@js-draw/math';
172
+ * console.log(
173
+ * new Mat33(
174
+ * 1, 2, 3,
175
+ * 4, 5, 6,
176
+ * 7, 8, 9,
177
+ * )
178
+ * );
179
+ * ```
89
180
  */
90
181
  toArray(): Mat33Array;
91
182
  /**
@@ -4,6 +4,46 @@ import Vec3 from './Vec3.mjs';
4
4
  * Represents a three dimensional linear transformation or
5
5
  * a two-dimensional affine transformation. (An affine transformation scales/rotates/shears
6
6
  * **and** translates while a linear transformation just scales/rotates/shears).
7
+ *
8
+ * In addition to other matrices, {@link Mat33}s can be used to transform {@link Vec3}s and {@link Vec2}s.
9
+ *
10
+ * For example, to move the point $(1, 1)$ by 5 units to the left and 6 units up,
11
+ * ```ts,runnable,console
12
+ * import {Mat33, Vec2} from '@js-draw/math';
13
+ *
14
+ * const moveLeftAndUp = Mat33.translation(Vec2.of(5, 6));
15
+ * console.log(moveLeftAndUp);
16
+ * ```
17
+ *
18
+ * This `moveLeftAndUp` matrix could then translate (move) a {@link Vec2} using
19
+ * {@link Mat33.transformVec2}:
20
+ *
21
+ * ```ts,runnable,console
22
+ * ---use-previous---
23
+ * ---visible---
24
+ * console.log(moveLeftAndUp.transformVec2(Vec2.of(1, 1)));
25
+ * console.log(moveLeftAndUp.transformVec2(Vec2.of(-1, 2)));
26
+ * ```
27
+ *
28
+ * It's also possible to create transformation matrices that scale and rotate.
29
+ * A single transform matrix can be created from multiple using matrix multiplication
30
+ * (see {@link Mat33.rightMul}):
31
+ *
32
+ * ```ts,runnable,console
33
+ * ---use-previous---
34
+ * ---visible---
35
+ * // Create a matrix by right multiplying.
36
+ * const scaleThenRotate =
37
+ * // The resultant matrix first scales by a factor of two
38
+ * Mat33.scaling2D(2).rightMul(
39
+ * // ...then rotates by pi/2 radians = 90 degrees.
40
+ * Mat33.zRotation(Math.PI / 2)
41
+ * );
42
+ * console.log(scaleThenRotate);
43
+ *
44
+ * // Use scaleThenRotate to scale then rotate a vector.
45
+ * console.log(scaleThenRotate.transformVec2(Vec2.unitX));
46
+ * ```
7
47
  */
8
48
  export class Mat33 {
9
49
  /**
@@ -15,6 +55,9 @@ export class Mat33 {
15
55
  * c1 & c2 & c3
16
56
  * \end{bmatrix}
17
57
  * $$
58
+ *
59
+ * Static constructor methods are also available.
60
+ * See {@link Mat33.scaling2D}, {@link Mat33.zRotation}, {@link Mat33.translation}, and {@link Mat33.fromCSSMatrix}.
18
61
  */
19
62
  constructor(a1, a2, a3, b1, b2, b3, c1, c2, c3) {
20
63
  this.a1 = a1;
@@ -125,6 +168,29 @@ export class Mat33 {
125
168
  transposed() {
126
169
  return new Mat33(this.a1, this.b1, this.c1, this.a2, this.b2, this.c2, this.a3, this.b3, this.c3);
127
170
  }
171
+ /**
172
+ * [Right-multiplies](https://en.wikipedia.org/wiki/Matrix_multiplication) this by `other`.
173
+ *
174
+ * See also {@link transformVec3} and {@link transformVec2}.
175
+ *
176
+ * Example:
177
+ * ```ts,runnable,console
178
+ * import {Mat33, Vec2} from '@js-draw/math';
179
+ * console.log(Mat33.identity.rightMul(Mat33.identity));
180
+ *
181
+ * // Create a matrix by right multiplying.
182
+ * const scaleThenRotate =
183
+ * // The resultant matrix first scales by a factor of two
184
+ * Mat33.scaling2D(2).rightMul(
185
+ * // ...then rotates by pi/4 radians = 45 degrees.
186
+ * Mat33.zRotation(Math.PI / 4)
187
+ * );
188
+ * console.log(scaleThenRotate);
189
+ *
190
+ * // Use scaleThenRotate to scale then rotate a vector.
191
+ * console.log(scaleThenRotate.transformVec2(Vec2.unitX));
192
+ * ```
193
+ */
128
194
  rightMul(other) {
129
195
  other = other.transposed();
130
196
  const at = (row, col) => {
@@ -174,6 +240,15 @@ export class Mat33 {
174
240
  }
175
241
  return true;
176
242
  }
243
+ /**
244
+ * Creates a human-readable representation of the matrix.
245
+ *
246
+ * Example:
247
+ * ```ts,runnable,console
248
+ * import { Mat33 } from '@js-draw/math';
249
+ * console.log(Mat33.identity.toString());
250
+ * ```
251
+ */
177
252
  toString() {
178
253
  let result = '';
179
254
  const maxColumnLens = [0, 0, 0];
@@ -222,6 +297,18 @@ export class Mat33 {
222
297
  * result[1] = element at row zero, column 1
223
298
  * ...
224
299
  * ```
300
+ *
301
+ * Example:
302
+ * ```ts,runnable,console
303
+ * import { Mat33 } from '@js-draw/math';
304
+ * console.log(
305
+ * new Mat33(
306
+ * 1, 2, 3,
307
+ * 4, 5, 6,
308
+ * 7, 8, 9,
309
+ * )
310
+ * );
311
+ * ```
225
312
  */
226
313
  toArray() {
227
314
  return [
@@ -429,5 +516,6 @@ export class Mat33 {
429
516
  return matrix ?? Mat33.identity;
430
517
  }
431
518
  }
519
+ /** The 3x3 [identity matrix](https://en.wikipedia.org/wiki/Identity_matrix). */
432
520
  Mat33.identity = new Mat33(1, 0, 0, 0, 1, 0, 0, 0, 1);
433
521
  export default Mat33;
@@ -7,7 +7,18 @@ interface IntersectionResult {
7
7
  point: Point2;
8
8
  t: number;
9
9
  }
10
- /** Represents a line segment. A `LineSegment2` is immutable. */
10
+ /**
11
+ * Represents a line segment. A `LineSegment2` is immutable.
12
+ *
13
+ * @example
14
+ * ```ts,runnable,console
15
+ * import {LineSegment2, Vec2} from '@js-draw/math';
16
+ * const l = new LineSegment2(Vec2.of(1, 1), Vec2.of(2, 2));
17
+ * console.log('length: ', l.length);
18
+ * console.log('direction: ', l.direction);
19
+ * console.log('bounding box: ', l.bbox);
20
+ * ```
21
+ */
11
22
  export declare class LineSegment2 extends Parameterized2DShape {
12
23
  private readonly point1;
13
24
  private readonly point2;
@@ -30,7 +41,7 @@ export declare class LineSegment2 extends Parameterized2DShape {
30
41
  * if no such line segment exists.
31
42
  *
32
43
  * @example
33
- * ```ts,runnable
44
+ * ```ts,runnable,console
34
45
  * import {LineSegment2, Vec2} from '@js-draw/math';
35
46
  * console.log(LineSegment2.ofSmallestContainingPoints([Vec2.of(1, 0), Vec2.of(0, 1)]));
36
47
  * ```
@@ -1,7 +1,18 @@
1
1
  import Rect2 from './Rect2.mjs';
2
2
  import { Vec2 } from '../Vec2.mjs';
3
3
  import Parameterized2DShape from './Parameterized2DShape.mjs';
4
- /** Represents a line segment. A `LineSegment2` is immutable. */
4
+ /**
5
+ * Represents a line segment. A `LineSegment2` is immutable.
6
+ *
7
+ * @example
8
+ * ```ts,runnable,console
9
+ * import {LineSegment2, Vec2} from '@js-draw/math';
10
+ * const l = new LineSegment2(Vec2.of(1, 1), Vec2.of(2, 2));
11
+ * console.log('length: ', l.length);
12
+ * console.log('direction: ', l.direction);
13
+ * console.log('bounding box: ', l.bbox);
14
+ * ```
15
+ */
5
16
  export class LineSegment2 extends Parameterized2DShape {
6
17
  /** Creates a new `LineSegment2` from its endpoints. */
7
18
  constructor(point1, point2) {
@@ -21,7 +32,7 @@ export class LineSegment2 extends Parameterized2DShape {
21
32
  * if no such line segment exists.
22
33
  *
23
34
  * @example
24
- * ```ts,runnable
35
+ * ```ts,runnable,console
25
36
  * import {LineSegment2, Vec2} from '@js-draw/math';
26
37
  * console.log(LineSegment2.ofSmallestContainingPoints([Vec2.of(1, 0), Vec2.of(0, 1)]));
27
38
  * ```
@@ -41,7 +41,7 @@ declare class PointShape2D extends Parameterized2DShape {
41
41
  minus(v: Vec3): Vec3;
42
42
  dot(other: Vec3): number;
43
43
  cross(other: Vec3): Vec3;
44
- scale(other: number | Vec3): Vec3;
44
+ scale(other: Vec3 | number): Vec3;
45
45
  orthog(): Vec3;
46
46
  extend(distance: number, direction: Vec3): Vec3;
47
47
  lerp(target: Vec3, fractionTo: number): Vec3;
@@ -80,7 +80,7 @@ export declare class Rect2 extends Abstract2DShape {
80
80
  minus(v: Vec3): Vec3;
81
81
  dot(other: Vec3): number;
82
82
  cross(other: Vec3): Vec3;
83
- scale(other: number | Vec3): Vec3;
83
+ scale(other: Vec3 | number): Vec3;
84
84
  orthog(): Vec3;
85
85
  extend(distance: number, direction: Vec3): Vec3;
86
86
  lerp(target: Vec3, fractionTo: number): Vec3;
@@ -0,0 +1,12 @@
1
+ # This file is generated by running "yarn install" inside your project.
2
+ # Manual changes might be lost - proceed with caution!
3
+
4
+ __metadata:
5
+ version: 8
6
+ cacheKey: 10c0
7
+
8
+ "js-draw-math-test-imports@workspace:.":
9
+ version: 0.0.0-use.local
10
+ resolution: "js-draw-math-test-imports@workspace:."
11
+ languageName: unknown
12
+ linkType: soft
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@js-draw/math",
3
- "version": "1.19.0",
3
+ "version": "1.21.1",
4
4
  "description": "A math library for js-draw. ",
5
5
  "types": "./dist/mjs/lib.d.ts",
6
6
  "main": "./dist/cjs/lib.js",
@@ -17,18 +17,17 @@
17
17
  },
18
18
  "author": "Henry Heino",
19
19
  "license": "MIT",
20
- "private": false,
21
20
  "scripts": {
22
- "dist-test": "cd dist-test/test_imports && npm install && npm run test",
23
- "dist": "npm run build && npm run dist-test",
24
- "build": "rm -rf ./dist && build-tool build",
21
+ "dist-test": "cd dist-test/test_imports && yarn install && yarn run test",
22
+ "dist": "yarn run build && yarn run dist-test",
23
+ "build": "build-tool build",
25
24
  "watch": "build-tool watch"
26
25
  },
27
26
  "dependencies": {
28
27
  "bezier-js": "6.1.3"
29
28
  },
30
29
  "devDependencies": {
31
- "@js-draw/build-tool": "^1.19.0",
30
+ "@js-draw/build-tool": "^1.21.1",
32
31
  "@types/bezier-js": "4.1.0",
33
32
  "@types/jest": "29.5.5",
34
33
  "@types/jsdom": "21.1.3"
@@ -45,5 +44,5 @@
45
44
  "svg",
46
45
  "math"
47
46
  ],
48
- "gitHead": "50fa44a2bb68b93d24efea433760a5e45c56293f"
47
+ "gitHead": "a46f0e1c3586e4b3019152eea87cd2784b00282f"
49
48
  }
package/src/Mat33.ts CHANGED
@@ -1,6 +1,9 @@
1
1
  import { Point2, Vec2 } from './Vec2';
2
2
  import Vec3 from './Vec3';
3
3
 
4
+ /**
5
+ * See {@link Mat33.toArray}.
6
+ */
4
7
  export type Mat33Array = [
5
8
  number, number, number,
6
9
  number, number, number,
@@ -11,6 +14,46 @@ export type Mat33Array = [
11
14
  * Represents a three dimensional linear transformation or
12
15
  * a two-dimensional affine transformation. (An affine transformation scales/rotates/shears
13
16
  * **and** translates while a linear transformation just scales/rotates/shears).
17
+ *
18
+ * In addition to other matrices, {@link Mat33}s can be used to transform {@link Vec3}s and {@link Vec2}s.
19
+ *
20
+ * For example, to move the point $(1, 1)$ by 5 units to the left and 6 units up,
21
+ * ```ts,runnable,console
22
+ * import {Mat33, Vec2} from '@js-draw/math';
23
+ *
24
+ * const moveLeftAndUp = Mat33.translation(Vec2.of(5, 6));
25
+ * console.log(moveLeftAndUp);
26
+ * ```
27
+ *
28
+ * This `moveLeftAndUp` matrix could then translate (move) a {@link Vec2} using
29
+ * {@link Mat33.transformVec2}:
30
+ *
31
+ * ```ts,runnable,console
32
+ * ---use-previous---
33
+ * ---visible---
34
+ * console.log(moveLeftAndUp.transformVec2(Vec2.of(1, 1)));
35
+ * console.log(moveLeftAndUp.transformVec2(Vec2.of(-1, 2)));
36
+ * ```
37
+ *
38
+ * It's also possible to create transformation matrices that scale and rotate.
39
+ * A single transform matrix can be created from multiple using matrix multiplication
40
+ * (see {@link Mat33.rightMul}):
41
+ *
42
+ * ```ts,runnable,console
43
+ * ---use-previous---
44
+ * ---visible---
45
+ * // Create a matrix by right multiplying.
46
+ * const scaleThenRotate =
47
+ * // The resultant matrix first scales by a factor of two
48
+ * Mat33.scaling2D(2).rightMul(
49
+ * // ...then rotates by pi/2 radians = 90 degrees.
50
+ * Mat33.zRotation(Math.PI / 2)
51
+ * );
52
+ * console.log(scaleThenRotate);
53
+ *
54
+ * // Use scaleThenRotate to scale then rotate a vector.
55
+ * console.log(scaleThenRotate.transformVec2(Vec2.unitX));
56
+ * ```
14
57
  */
15
58
  export class Mat33 {
16
59
  private readonly rows: Vec3[];
@@ -24,6 +67,9 @@ export class Mat33 {
24
67
  * c1 & c2 & c3
25
68
  * \end{bmatrix}
26
69
  * $$
70
+ *
71
+ * Static constructor methods are also available.
72
+ * See {@link Mat33.scaling2D}, {@link Mat33.zRotation}, {@link Mat33.translation}, and {@link Mat33.fromCSSMatrix}.
27
73
  */
28
74
  public constructor(
29
75
  public readonly a1: number,
@@ -63,6 +109,7 @@ export class Mat33 {
63
109
  );
64
110
  }
65
111
 
112
+ /** The 3x3 [identity matrix](https://en.wikipedia.org/wiki/Identity_matrix). */
66
113
  public static identity = new Mat33(
67
114
  1, 0, 0,
68
115
  0, 1, 0,
@@ -178,6 +225,29 @@ export class Mat33 {
178
225
  );
179
226
  }
180
227
 
228
+ /**
229
+ * [Right-multiplies](https://en.wikipedia.org/wiki/Matrix_multiplication) this by `other`.
230
+ *
231
+ * See also {@link transformVec3} and {@link transformVec2}.
232
+ *
233
+ * Example:
234
+ * ```ts,runnable,console
235
+ * import {Mat33, Vec2} from '@js-draw/math';
236
+ * console.log(Mat33.identity.rightMul(Mat33.identity));
237
+ *
238
+ * // Create a matrix by right multiplying.
239
+ * const scaleThenRotate =
240
+ * // The resultant matrix first scales by a factor of two
241
+ * Mat33.scaling2D(2).rightMul(
242
+ * // ...then rotates by pi/4 radians = 45 degrees.
243
+ * Mat33.zRotation(Math.PI / 4)
244
+ * );
245
+ * console.log(scaleThenRotate);
246
+ *
247
+ * // Use scaleThenRotate to scale then rotate a vector.
248
+ * console.log(scaleThenRotate.transformVec2(Vec2.unitX));
249
+ * ```
250
+ */
181
251
  public rightMul(other: Mat33): Mat33 {
182
252
  other = other.transposed();
183
253
 
@@ -245,6 +315,15 @@ export class Mat33 {
245
315
  return true;
246
316
  }
247
317
 
318
+ /**
319
+ * Creates a human-readable representation of the matrix.
320
+ *
321
+ * Example:
322
+ * ```ts,runnable,console
323
+ * import { Mat33 } from '@js-draw/math';
324
+ * console.log(Mat33.identity.toString());
325
+ * ```
326
+ */
248
327
  public toString(): string {
249
328
  let result = '';
250
329
  const maxColumnLens = [ 0, 0, 0 ];
@@ -297,6 +376,18 @@ export class Mat33 {
297
376
  * result[1] = element at row zero, column 1
298
377
  * ...
299
378
  * ```
379
+ *
380
+ * Example:
381
+ * ```ts,runnable,console
382
+ * import { Mat33 } from '@js-draw/math';
383
+ * console.log(
384
+ * new Mat33(
385
+ * 1, 2, 3,
386
+ * 4, 5, 6,
387
+ * 7, 8, 9,
388
+ * )
389
+ * );
390
+ * ```
300
391
  */
301
392
  public toArray(): Mat33Array {
302
393
  return [
@@ -481,7 +572,7 @@ export class Mat33 {
481
572
 
482
573
  return argNumber;
483
574
  });
484
- return parsed.filter(n => n !== null) as number[];
575
+ return parsed.filter(n => n !== null);
485
576
  };
486
577
 
487
578
 
@@ -118,7 +118,7 @@ export abstract class BezierJSWrapper extends Parameterized2DShape {
118
118
  }
119
119
 
120
120
  return t;
121
- }).filter(entry => entry !== null) as number[];
121
+ }).filter(entry => entry !== null);
122
122
  }
123
123
 
124
124
  public override splitAt(t: number): [BezierJSWrapper] | [BezierJSWrapper, BezierJSWrapper] {
@@ -9,7 +9,18 @@ interface IntersectionResult {
9
9
  t: number;
10
10
  }
11
11
 
12
- /** Represents a line segment. A `LineSegment2` is immutable. */
12
+ /**
13
+ * Represents a line segment. A `LineSegment2` is immutable.
14
+ *
15
+ * @example
16
+ * ```ts,runnable,console
17
+ * import {LineSegment2, Vec2} from '@js-draw/math';
18
+ * const l = new LineSegment2(Vec2.of(1, 1), Vec2.of(2, 2));
19
+ * console.log('length: ', l.length);
20
+ * console.log('direction: ', l.direction);
21
+ * console.log('bounding box: ', l.bbox);
22
+ * ```
23
+ */
13
24
  export class LineSegment2 extends Parameterized2DShape {
14
25
  // invariant: ||direction|| = 1
15
26
 
@@ -51,7 +62,7 @@ export class LineSegment2 extends Parameterized2DShape {
51
62
  * if no such line segment exists.
52
63
  *
53
64
  * @example
54
- * ```ts,runnable
65
+ * ```ts,runnable,console
55
66
  * import {LineSegment2, Vec2} from '@js-draw/math';
56
67
  * console.log(LineSegment2.ofSmallestContainingPoints([Vec2.of(1, 0), Vec2.of(0, 1)]));
57
68
  * ```
@@ -1,13 +0,0 @@
1
- {
2
- "name": "js-draw-math-test-imports",
3
- "version": "0.0.1",
4
- "lockfileVersion": 3,
5
- "requires": true,
6
- "packages": {
7
- "": {
8
- "name": "js-draw-math-test-imports",
9
- "version": "0.0.1",
10
- "license": "MIT"
11
- }
12
- }
13
- }