@twick/2d 0.14.21 → 0.15.0

package/src/lib/curves/PolynomialSegment.ts

@@ -1,124 +0,0 @@
-import {transformVectorAsPoint, type BBox, type Vector2} from '@twick/core';
-import {moveTo} from '../utils';
-import type {CurvePoint} from './CurvePoint';
-import type {Polynomial2D} from './Polynomial2D';
-import {Segment} from './Segment';
-import {UniformPolynomialCurveSampler} from './UniformPolynomialCurveSampler';
-
-export abstract class PolynomialSegment extends Segment {
-  protected readonly pointSampler: UniformPolynomialCurveSampler;
-
-  public get arcLength(): number {
-    return this.length;
-  }
-
-  public abstract override get points(): Vector2[];
-
-  protected constructor(
-    protected readonly curve: Polynomial2D,
-    protected readonly length: number,
-  ) {
-    super();
-    this.pointSampler = new UniformPolynomialCurveSampler(this);
-  }
-
-  public getBBox(): BBox {
-    return this.curve.getBounds();
-  }
-
-  /**
-   * Evaluate the polynomial at the given t value.
-   *
-   * @param t - The t value at which to evaluate the curve.
-   */
-  public eval(t: number): CurvePoint {
-    const tangent = this.tangent(t);
-
-    return {
-      position: this.curve.eval(t),
-      tangent,
-      normal: tangent.perpendicular,
-    };
-  }
-
-  /**
-   * Split the curve into two separate polynomials at the given t value. The two
-   * resulting curves form the same overall shape as the original curve.
-   *
-   * @param t - The t value at which to split the curve.
-   */
-  public abstract split(t: number): [PolynomialSegment, PolynomialSegment];
-
-  public getPoint(distance: number): CurvePoint {
-    const closestPoint = this.pointSampler.pointAtDistance(
-      this.arcLength * distance,
-    );
-    return {
-      position: closestPoint.position,
-      tangent: closestPoint.tangent,
-      normal: closestPoint.tangent.perpendicular,
-    };
-  }
-
-  public transformPoints(matrix: DOMMatrix): Vector2[] {
-    return this.points.map(point => transformVectorAsPoint(point, matrix));
-  }
-
-  /**
-   * Return the tangent of the point that sits at the provided t value on the
-   * curve.
-   *
-   * @param t - The t value at which to evaluate the curve.
-   */
-  public tangent(t: number): Vector2 {
-    return this.curve.evalDerivative(t).normalized;
-  }
-
-  public draw(
-    context: CanvasRenderingContext2D | Path2D,
-    start = 0,
-    end = 1,
-    move = true,
-  ): [CurvePoint, CurvePoint] {
-    let curve: PolynomialSegment | null = null;
-    let startT = start;
-    let endT = end;
-    let points = this.points;
-
-    if (start !== 0 || end !== 1) {
-      const startDistance = this.length * start;
-      const endDistance = this.length * end;
-
-      startT = this.pointSampler.distanceToT(startDistance);
-      endT = this.pointSampler.distanceToT(endDistance);
-      const relativeEndT = (endT - startT) / (1 - startT);
-
-      const [, startSegment] = this.split(startT);
-      [curve] = startSegment.split(relativeEndT);
-      points = curve.points;
-    }
-
-    if (move) {
-      moveTo(context, points[0]);
-    }
-    (curve ?? this).doDraw(context);
-
-    const startTangent = this.tangent(startT);
-    const endTangent = this.tangent(endT);
-
-    return [
-      {
-        position: points[0],
-        tangent: startTangent,
-        normal: startTangent.perpendicular,
-      },
-      {
-        position: points.at(-1)!,
-        tangent: endTangent,
-        normal: endTangent.perpendicular,
-      },
-    ];
-  }
-
-  protected abstract doDraw(context: CanvasRenderingContext2D | Path2D): void;
-}

package/src/lib/curves/QuadBezierSegment.ts

@@ -1,64 +0,0 @@
-import {Vector2, lazy} from '@twick/core';
-import {quadraticCurveTo} from '../utils';
-import {Polynomial2D} from './Polynomial2D';
-import {PolynomialSegment} from './PolynomialSegment';
-
-/**
- * A spline segment representing a quadratic Bézier curve.
- */
-export class QuadBezierSegment extends PolynomialSegment {
-  @lazy(() => document.createElementNS('http://www.w3.org/2000/svg', 'path'))
-  private static el: SVGPathElement;
-
-  public get points(): Vector2[] {
-    return [this.p0, this.p1, this.p2];
-  }
-
-  public constructor(
-    public readonly p0: Vector2,
-    public readonly p1: Vector2,
-    public readonly p2: Vector2,
-  ) {
-    super(
-      new Polynomial2D(
-        p0,
-        // 2*(-p0+p1)
-        p0.flipped.add(p1).scale(2),
-        // p0-2*p1+p2
-        p0.sub(p1.scale(2)).add(p2),
-      ),
-      QuadBezierSegment.getLength(p0, p1, p2),
-    );
-  }
-
-  public split(t: number): [PolynomialSegment, PolynomialSegment] {
-    const a = new Vector2(
-      this.p0.x + (this.p1.x - this.p0.x) * t,
-      this.p0.y + (this.p1.y - this.p0.y) * t,
-    );
-    const b = new Vector2(
-      this.p1.x + (this.p2.x - this.p1.x) * t,
-      this.p1.y + (this.p2.y - this.p1.y) * t,
-    );
-    const p = new Vector2(a.x + (b.x - a.x) * t, a.y + (b.y - a.y) * t);
-
-    const left = new QuadBezierSegment(this.p0, a, p);
-    const right = new QuadBezierSegment(p, b, this.p2);
-
-    return [left, right];
-  }
-
-  protected static getLength(p0: Vector2, p1: Vector2, p2: Vector2): number {
-    // Let the browser do the work for us instead of calculating the arclength
-    // manually.
-    QuadBezierSegment.el.setAttribute(
-      'd',
-      `M ${p0.x} ${p0.y} Q ${p1.x} ${p1.y} ${p2.x} ${p2.y}`,
-    );
-    return QuadBezierSegment.el.getTotalLength();
-  }
-
-  protected override doDraw(context: CanvasRenderingContext2D | Path2D) {
-    quadraticCurveTo(context, this.p1, this.p2);
-  }
-}

package/src/lib/curves/Segment.ts

@@ -1,17 +0,0 @@
-import type {Vector2} from '@twick/core';
-import type {CurvePoint} from './CurvePoint';
-
-export abstract class Segment {
-  public abstract readonly points: Vector2[];
-
-  public abstract draw(
-    context: CanvasRenderingContext2D | Path2D,
-    start: number,
-    end: number,
-    move: boolean,
-  ): [CurvePoint, CurvePoint];
-
-  public abstract getPoint(distance: number): CurvePoint;
-
-  public abstract get arcLength(): number;
-}

package/src/lib/curves/UniformPolynomialCurveSampler.ts

@@ -1,94 +0,0 @@
-import type {Vector2} from '@twick/core';
-import {clamp, remap} from '@twick/core';
-import type {CurvePoint} from './CurvePoint';
-import type {PolynomialSegment} from './PolynomialSegment';
-
-/**
- * Class to uniformly sample points on a given polynomial curve.
- *
- * @remarks
- * In order to uniformly sample points from non-linear curves, this sampler
- * re-parameterizes the curve by arclength.
- */
-export class UniformPolynomialCurveSampler {
-  private sampledDistances: number[] = [];
-
-  /**
-   * @param curve - The curve to sample
-   * @param samples - How many points to sample from the provided curve. The
-   *                  more points get sampled, the higher the resolution–and
-   *                  therefore precision–of the sampler.
-   */
-  public constructor(
-    private readonly curve: PolynomialSegment,
-    samples = 20,
-  ) {
-    this.resample(samples);
-  }
-
-  /**
-   * Discard all previously sampled points and resample the provided number of
-   * points from the curve.
-   *
-   * @param samples - The number of points to sample.
-   */
-  public resample(samples: number): void {
-    this.sampledDistances = [0];
-
-    let length = 0;
-    let previous: Vector2 = this.curve.eval(0).position;
-    for (let i = 1; i < samples; i++) {
-      const t = i / (samples - 1);
-      const curvePoint = this.curve.eval(t);
-      const segmentLength = previous.sub(curvePoint.position).magnitude;
-
-      length += segmentLength;
-
-      this.sampledDistances.push(length);
-      previous = curvePoint.position;
-    }
-
-    // Account for any accumulated floating point errors and explicitly set the
-    // distance of the last point to the arclength of the curve.
-    this.sampledDistances[this.sampledDistances.length - 1] =
-      this.curve.arcLength;
-  }
-
-  /**
-   * Return the point at the provided distance along the sampled curve's
-   * arclength.
-   *
-   * @param distance - The distance along the curve's arclength for which to
-   *                   retrieve the point.
-   */
-  public pointAtDistance(distance: number): CurvePoint {
-    return this.curve.eval(this.distanceToT(distance));
-  }
-
-  /**
-   * Return the t value for the point at the provided distance along the sampled
-   * curve's arc length.
-   *
-   * @param distance - The distance along the arclength
-   */
-  public distanceToT(distance: number): number {
-    const samples = this.sampledDistances.length;
-    distance = clamp(0, this.curve.arcLength, distance);
-
-    for (let i = 0; i < samples; i++) {
-      const lower = this.sampledDistances[i];
-      const upper = this.sampledDistances[i + 1];
-      if (distance >= lower && distance <= upper) {
-        return remap(
-          lower,
-          upper,
-          i / (samples - 1),
-          (i + 1) / (samples - 1),
-          distance,
-        );
-      }
-    }
-
-    return 1;
-  }
-}