Skip to content

Instantly share code, notes, and snippets.

View steveruizok's full-sized avatar
🏠

Steve Ruiz steveruizok

🏠
View GitHub Profile
@steveruizok
steveruizok / vec.ts
Created May 22, 2021 21:12
Vector math.
/**
* Clamp a value into a range.
* @param n
* @param min
*/
export function clamp(n: number, min: number): number
export function clamp(n: number, min: number, max: number): number
export function clamp(n: number, min: number, max?: number): number {
return Math.max(min, typeof max !== "undefined" ? Math.min(n, max) : n)
}
@steveruizok
steveruizok / getRotatedEllipseBounds.ts
Last active May 22, 2021 21:12
get bounds of a rotated ellipse
export function getRotatedEllipseBounds(
x: number,
y: number,
rx: number,
ry: number,
rotation: number
) {
const c = Math.cos(rotation)
const s = Math.sin(rotation)
const w = Math.hypot(rx * c, ry * s)
@steveruizok
steveruizok / getRelativeTransformedBoundingBox.ts
Last active June 20, 2021 17:07
Transform a rotated bounding box.
export function getRelativeTransformedBoundingBox(
bounds: Bounds,
initialBounds: Bounds,
initialShapeBounds: Bounds,
isFlippedX: boolean,
isFlippedY: boolean
) {
const minX =
bounds.minX +
@steveruizok
steveruizok / cubic-bezier-length.ts
Created May 6, 2021 20:25
Length of a cubic bezier curve
function pointOnBezierCurve(
start: number[],
cp1: number[],
cp2: number[],
end: number[],
t: number
) {
let [ax, ay] = start
let [bx, by] = cp1
let [cx, cy] = cp2
@steveruizok
steveruizok / getStreamlinedPoints.ts
Created April 27, 2021 20:45
Streamline a point set, removing irregularities.
/**
* ## getStreamlinedPoints
* @description Streamline a point set, removing irregularities.
* @param points An array of points (as `[x, y]`).
* @returns number[][]
*/
export function getStreamlinedPoints(points: number[][], streamline = 0.5) {
return points.reduce<number[][]>((acc, cur, i, arr) => {
if (i === 0) {
@steveruizok
steveruizok / getSplinedPts.js
Last active April 24, 2021 19:43
Get points on a spine through n points.
const pts = [
[300, 100],
[500, 200],
[700, 250],
[800, 300],
[900, 500],
[800, 600],
[650, 650],
[500, 600],
]
@steveruizok
steveruizok / ray-ray-intersection.ts
Last active April 17, 2021 20:58
Find the intersection point between two rays.
/**
* Get the intersection of two rays, with origin points p0 and p1, and direction vectors n0 and n1.
* @param p0 The origin point of the first ray
* @param n0 The direction vector of the first ray
* @param p1 The origin point of the second ray
* @param n1 The direction vector of the second ray
* @returns
*/
export function getRayRayIntesection(
@steveruizok
steveruizok / nearestPointOnLine.ts
Created April 17, 2021 10:52
Given a point and a line (or line segment), get the nearest point on the line.
/**
* Get the nearest point on a line with a known unit vector that passes through point A
* @param A Any point on the line
* @param u The unit vector for the line.
* @param P A point not on the line to test.
* @returns
*/
export function nearestPointOnLineThroughPoint(
A: number[],
u: number[],
@steveruizok
steveruizok / getClosestPointOnPath.ts
Created March 31, 2021 19:28
From an off-path point, get the closest on-path point. (With SVG paths).
/**
* Find the closest point on a path to an off-path point.
* @param pathNode
* @param point
* @returns
*/
export function getClosestPointOnPath(
pathNode: SVGPathElement,
point: number[]
) {
@steveruizok
steveruizok / bezier-bounding-box.ts
Created March 28, 2021 11:27
Get the bounding box of a cubic bezier curve.
// Get the bounding box of a cubic bezier curve.
// Adapted from https://stackoverflow.com/a/24814530/7437688
// Evaluate a point along a 1d bezier curve.
export function bez1d(a: number, b: number, c: number, d: number, t: number) {
return (
a * (1 - t) * (1 - t) * (1 - t) +
3 * b * t * (1 - t) * (1 - t) +
3 * c * t * t * (1 - t) +
d * t * t * t