(Non-exhaustive) selection/overview of rectangle operations provided by https://thi.ng/geom

rectops.ts

rect(100)
// Rect { pos: [ 0, 0 ], attribs: undefined, size: [ 100, 100 ] }

rect([100, 200], 100)
// Rect { pos: [ 100, 200 ], attribs: undefined, size: [ 100, 100 ] }

rect([100, 200], [10, 20])
// Rect { pos: [ 100, 200 ], attribs: undefined, size: [ 10, 20 ] }

rectFromCentroid([100, 200], 100)
// Rect { pos: [ 50, 150 ], attribs: undefined, size: [ 100, 100 ] }

rectFromCentroid([100, 200], [10, 20])
// Rect { pos: [ 95, 190 ], attribs: undefined, size: [ 10, 20 ] }

rectFromCentroidWithMargin([100, 200], [10, 20], 5)
// Rect { pos: [ 90, 185 ], attribs: undefined, size: [ 20, 30 ] }

rectFromMinMax([100, 200], [150, 300])
// Rect { pos: [ 100, 200 ], attribs: undefined, size: [ 50, 100 ] }

bounds(circle([100, 200], 50))
// Rect { pos: [ 50, 150 ], attribs: undefined, size: [ 100, 100 ] }

let r = rect(100)
let r2 = rectFromMinMax([100, 200], [200, 250]);

area(r)
// 10000

arcLength(r) // aka perimeter
// 400

asPolygon(r)
// Polygon {
//   points: [ [ 0, 0 ], [ 100, 0 ], [ 100, 100 ], [ 0, 100 ] ],
//   attribs: {}
// }

asSvg(r)
// <rect x="0" y="0" width="100" height="100"/>

asSvg(svgDoc({ fill: "none", stroke: "red"}, r))
// <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
// width="100" height="100" viewBox="0 0 100 100" fill="none" stroke="red">
// <rect x="0" y="0" width="100" height="100"/></svg>

centroid(r)
// [ 50, 50 ]

center(r)
// Rect { pos: [ -50, -50 ], attribs: {}, size: [ 100, 100 ] }

clipConvex(r, rect([50, 50], 100)) // clip against boundary (any convex poly)
// Polygon {
//   points: [ [ 50, 50 ], [ 100, 50 ], [ 100, 100 ], [ 50, 100 ] ],
//   attribs: {}
// }

closestPoint(r, [-10, 20])
// [ 0, 20 ]

[...edges(r)]
// [
//   [ [ 0, 0 ], [ 100, 0 ] ],
//   [ [ 100, 0 ], [ 100, 100 ] ],
//   [ [ 100, 100 ], [ 0, 100 ] ],
//   [ [ 0, 100 ], [ 0, 0 ] ]
// ]

intersects(r, rect([50, 50], 100))
// { type: IntersectionType.INTERSECT }

intersects(ray([-100,50], [1, 0]), r)
// {
//   type: IntersectionType.INTERSECT,
//   isec: [ [ 0, 50 ], [ 100, 50 ] ],
//   alpha: 100,
//   beta: 200
// }

intersectionRect(r, rect([50, 50], 100))
// Rect { pos: [ 50, 50 ], attribs: undefined, size: [ 50, 50 ] }

mapPoint(r2, [150, 240])
// [ 0.5, 0.8 ]

unmapPoint(r2, [0.5, 0.8])
// [ 150, 240 ]

warpPoints([[150, 240], [200, 210]], r, r2) // transfer pts from r2 -> r
// [ [ 50, 80 ], [ 100, 20 ] ]

pointInside(r, [50, 50])
// true

scatter(r, 3) // pick N random points
// [ [ 98.09, 80.65 ], [ 46.55, 97.13 ], [ 34.99, 30.41 ] ]

resample(r, { dist: 50 }) // resample w/ uniform vertex dist
// Polygon {
//   points: [
//     [ 0, 0 ], [ 50, 0 ], [ 100, 0 ], [ 100, 50 ],
//     [ 100, 100 ], [ 50, 100 ], [ 0, 100 ], [ 0, 50 ]
//   ],
//   attribs: {}
// }

rotate(r, Math.PI / 3) // auto-converts to polygon
// Polygon {
//   points: [ [ 0, 0 ], [ 50, 86.6 ], [ -36.6, 136.6 ], [ -86.6, 50 ] ],
//   attribs: {}
// }

scale(r, 2)
// Rect { pos: [ 0, 0 ], attribs: {}, size: [ 200, 200 ] }

// see thi.ng/geom-subdiv-curve
subdivCurve(asPolygon(r), SUBDIV_CHAIKIN_CLOSED, 2)
// Polygon {
//   points: [
//     [ 0, 37.5 ], [ 6.25, 18.75 ], [ 18.75, 6.25 ], [ 37.5, 0 ],
//     [ 62.5, 0 ], [ 81.25, 6.25 ], [ 93.75, 18.75 ], [ 100, 37.5 ],
//     [ 100, 62.5 ], [ 93.75, 81.25 ], [ 81.25, 93.75 ], [ 62.5, 100 ],
//     [ 37.5, 100 ], [ 18.75, 93.75 ], [ 6.25, 81.25 ], [ 0, 62.5 ]
//   ],
//   attribs: {}
// }

// tangent at parametric boundary pos
tangentAt(r, 0.2)
// [ 1, 0 ]
tangentAt(r, 0.3)
// [ 0, 1 ]

// see thi.ng/geom-tessellate
tessellate(r, [triFan])
// [
//   [ [ 0, 0 ], [ 100, 0 ], [ 50, 50 ] ],
//   [ [ 100, 0 ], [ 100, 100 ], [ 50, 50 ] ],
//   [ [ 100, 100 ], [ 0, 100 ], [ 50, 50 ] ],
//   [ [ 0, 100 ], [ 0, 0 ], [ 50, 50 ] ]
// ]

union(r, r2)
// [ Rect { pos: [ 0, 0 ], attribs: undefined, size: [ 200, 250 ] } ]

vertices(r, 12)
// [
//   [ 0, 0 ], [ 33.33, 0 ], [ 66.66, 0 ], [ 100, 0 ],
//   [ 100, 33.33 ], [ 100, 66.66 ], [ 100, 100 ], [ 66.66, 100 ],
//   [ 33.33, 100 ], [ 0, 100 ], [ 0, 66.66 ], [ 0, 33.33 ]
// ]