Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/stagas/geometrik
Geometry classes and utils.
https://github.com/stagas/geometrik
Last synced: 14 days ago
JSON representation
Geometry classes and utils.
- Host: GitHub
- URL: https://github.com/stagas/geometrik
- Owner: stagas
- License: mit
- Created: 2022-07-30T00:33:09.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2022-12-07T16:30:13.000Z (almost 2 years ago)
- Last Synced: 2024-10-13T02:39:45.627Z (about 1 month ago)
- Language: TypeScript
- Size: 104 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
geometrik 
Geometry classes and utils.
npm i geometrik
pnpm add geometrik
yarn add geometrik
## Examples
# rect-collision
- #
view source example/rect-collision.ts
```ts
import { Point, Rect } from 'geometrik'
let randomSeed = 15151523
function random(x = 1) {
return (
(Math.sin(
10e10 * randomSeed
* Math.cos(5e10 * ++randomSeed)
)
+ Math.sin(
10e10 * randomSeed
* Math.sin(5e10 * ++randomSeed)
)
+ Math.sin(
10e10 * randomSeed
* Math.cos(5e10 * ++randomSeed)
))
/ 3
* 0.5 + 0.5
)
* x
}
const view = new Point(400, 400)
const minSize = 10
const scale = 50
const rects = Array.from(
{ length: 20 },
() =>
new Rect(
random(view.x),
random(view.y),
minSize + random(scale),
minSize + random(scale)
) as Rect & { div: HTMLDivElement }
)
for (const r of rects) {
const div = document.createElement('div')
;(r as any).div = div
const color = `hsl(${random(360)}, 50%, 50%)`
Object.assign(div.style, r.toStyle(), { position: 'absolute' })
div.style.backgroundColor = color
document.body.appendChild(div)
}
const h = rects[0]
window.onpointermove = e => {
h.x = e.pageX - h.width / 2
h.y = e.pageY - h.height / 2
for (const r of rects) {
if (h === r) continue
if (h.intersectsRect(r)) {
const p = h.collisionResponse(r)
// const c2 = r.intersectPoint(h)
h.translateSelf(p.scale(0.5))
r.translateSelf(p.scale(-0.5))
// r.setPosition(c2.add(h.center).sub(r.size.scale(0.5)))
// r.translateSelf(c.scale(-0.5))
Object.assign(r.div.style, r.toStylePosition())
// h.setPosition(h.touchPoint(r))
}
}
Object.assign(h.div.style, h.toStylePosition())
}
```
web - #
view source example/web.ts
```ts
import * as geometrik from 'geometrik'
console.log(new geometrik.Rect())
```
## API
# Intersect
Line # angle()
angle() =>
- number
angleDegrees()
angleDegrees() =>
- number
clone(this) # dot(this) # getLineToRectangleCollisionResponse(this, intersection, r) # intersectionRect(r) # intersectsLine(other) # intersectsRect(r) # mag(this) # translate(this, x) # translateSelf(this, x) # Matrix # flipX()
flipX() =>
flipY()
flipY() =>
inverse()
inverse() =>
multiply(other) # rotate(rotX, rotY, rotZ) # rotateAxisAngle(x, y, z, angle) # rotateFromVector(x, y) # scale(scaleX, scaleY, scaleZ, originX, originY, originZ) # scaleX
number
scaleY number
scaleZ number
originX number
originY number
originZ number
scale(scaleX, scaleY, scaleZ, originX, originY, originZ) =>
scale3d(scale, originX, originY, originZ) # scale
number
originX number
originY number
originZ number
scale3d(scale, originX, originY, originZ) =>
scaleSelf(scaleX, scaleY, scaleZ, originX, originY, originZ) # scaleX
number
scaleY number
scaleZ number
originX number
originY number
originZ number
scaleSelf(scaleX, scaleY, scaleZ, originX, originY, originZ) =>
skewX(sx) # skewY(sy) # toJSON()
toJSON() =>
- Float64Array
translate(tx, ty, tz) # translateSelf(tx, ty, tz) # Morph # Point # x number
y number
bottom height left pos position right size top width [iterator]()
[iterator]() =>
IterableIterator<number>
abs(this) # absSelf(this) # absoluteSum(this) # add(this, x) # addSelf(this, x) # angleTo(this, other) # chebyshev(this, other) # clampMinSelf(this, min) # clampSelf(this, min, max) # clone(this) # contain(this, other) # containSelf(this, other) # diff(this, other) # diffSelf(this, other) # distance(this, other) # dot(this, other) # draw(this, color, position) # this
color = 'yellow' string
position = 'absolute' string
draw(this, color, position) =>
- HTMLDivElement
equals(this, other) # equalsAny(this, other) # euclidean(this, other) # gridRound(this, p) # gridRoundSelf(this, p) # interpolate(this, other, t) # interpolateSelf(this, other, t) # intersectPoint(this, other, center) # length(this) # mag(this) # manhattan(this, other) # max(this) # min(this) # multiply(this, x) # multiplySelf(this, x) # negate(this) # negateSelf(this) # normal(this) # normalize(this, other) # this
other DOMMatrix
normalize(this, other) =>
#
this
#
other normalize(this, other) =>
#
this
#
other normalize(this, other) =>
#
this
#
x number
#
y number
normalize(this, x, y) =>
#
this normalize(this) =>
normalizeSelf(this, other) # this
other DOMMatrix
normalizeSelf(this, other) =>
#
this
#
other normalizeSelf(this, other) =>
#
this
#
other normalizeSelf(this, other) =>
#
this
#
x number
#
y number
normalizeSelf(this, x, y) =>
#
this normalizeSelf(this) =>
octile(this, other) # precisionRound(this, p) # precisionRoundSelf(this, p) # round(this) # roundSelf(this) # scale(this, x) # scaleLinear(this, x) # scaleLinearSelf(this, x) # scaleSelf(this, x) # screen(this, other) # screenSelf(this, other) # set(other) # setLeft(x) # setTop(y) # square(this) # squareSelf(this) # sub(this, x) # subSelf(this, x) # sum(this) # toCSSStyle()
toCSSStyle() =>
- string
toJSON()
toJSON() =>
toPositionObject() # toSizeObject() # toString()
toString() =>
- string
toStyle()
toStyle() =>
Partial<CSSStyleDeclaration>
toStylePct()
toStylePct() =>
Partial<CSSStyleDeclaration>
toStylePosition()
toStylePosition() =>
Partial<CSSStyleDeclaration>
toStylePositionPct()
toStylePositionPct() =>
Partial<CSSStyleDeclaration>
toStyleSize()
toStyleSize() =>
Partial<CSSStyleDeclaration>
toStyleSizePct()
toStyleSizePct() =>
Partial<CSSStyleDeclaration>
touchPoint(this, other, center) # transform(this, matrix) # transformSelf(this, matrix) # translate(this, x) # translateSelf(this, x) # unit(this) # withinRect(this, other) # zoomLinear(this, x) # zoomLinearSelf(this, x) # compare(a, b) # fromAngle(radians) # fromAngleDegrees(degrees) # fromElement(el) # fromMatrix(matrix) # fromObject(obj) # Polygon # constructor(polygon)
points Point []
forEach length slice absSum(this) boundingRect(this) # chop(this, min, max) # chopSelf(this, min, max) # fit(this, length) # fitSelf(this, length) # mag(this) # rope(this, coeff) # ropeSelf(this, coeff) # screen(this, other) # toSVGPath()
toSVGPath() =>
- string
translateSelf(this, other) # absSum(points) # boundingRect(points) # chop(points, min, max) # fit(points, length) # mag(points) # morph(morphFn, from, to, t) # resample(points, index, t) # resampleCubic(points, index, t) # resampleSpline(points, index, t) # rope(points, coeff) # sat(p1, p2) # screen(a, b) # sum(points) # toSVGPath(points) # Polyline # fromPoints(points) # Rect # constructor(obj)
height number
width number
x number
y number
boundingRect = Rect.combine bottom bottomLeft bottomLine bottomRight center left leftLine points pos position right rightLine size top topLeft topLine topRight [iterator]()
[iterator]() =>
IterableIterator<number>
add(this, x) # addSelf(this, x) # clone(this) # collisionResponse(this, other) # contain(this, other) # containSelf(this, other) # distanceRect(this, other) # draw(this, color, position) # this
color = 'red' string
position = 'absolute' string
draw(this, color, position) =>
- HTMLDivElement
equals(this, other) # interpolate(this, other, t) # interpolateSelf(this, other, t) # intersectPoint(this, other, center) # intersectionRect(this, other) # intersectsRect(this, other) # maybeCalculateLines()
maybeCalculateLines() =>
- void
multiply(this, x) # this
x
multiply(this, x) =>
#
this
#
x number
#
y number
#
w number
#
h number
multiply(this, x, y, w, h) =>
multiplySelf(this, x) # this
x
multiplySelf(this, x) =>
#
this
#
x number
#
y number
#
w number
#
h number
multiplySelf(this, x, y, w, h) =>
negate(this) # negateSelf(this) # normalize(this, matrix) # normalizeSelf(this, matrix) # this
matrix DOMMatrix
normalizeSelf(this, matrix) =>
#
this
#
other normalizeSelf(this, other) =>
place(this, other, placement) # placeSelf(this, other, placement) # round(this) # roundSelf(this) # scale(this, x) # scaleLinear(this, x) # scaleLinearSelf(this, x) # scaleSelf(this, x) # screen(this, other) # screenSelf(this, other) # set(this, other) # setHeight(height) # setLeft(x) # setPosition(this, other) # setSize(this, other) # setTop(y) # setWidth(width) # sub(this, x) # subSelf(this, x) # toCSSStyle()
toCSSStyle() =>
- string
toJSON() # toPositionObject() # toSVGPath()
toSVGPath() =>
- string
toSizeObject() # toString()
toString() =>
- string
toStyle()
toStyle() =>
Partial<CSSStyleDeclaration>
toStylePct()
toStylePct() =>
Partial<CSSStyleDeclaration>
toStylePosition()
toStylePosition() =>
Partial<CSSStyleDeclaration>
toStylePositionPct()
toStylePositionPct() =>
Partial<CSSStyleDeclaration>
toStyleSize()
toStyleSize() =>
Partial<CSSStyleDeclaration>
toStyleSizePct()
toStyleSizePct() =>
Partial<CSSStyleDeclaration>
touchPoint(this, other, center) # transform(this, matrix) # transformSelf(this, matrix) # translate(this, x) # translateSelf(this, x) # withinRect(this, other) # zoomLinear(this, x) # zoomLinearSelf(this, x) # combine(rects) # compare(a, b) # fromElement(el) fromElement(el) =>
#fromObject(obj) # fromPoints(topLeft, bottomRight) # fromUnsortedPoints(p1, p2) # Scalar # scaleSelf(this, x) # transformSelf(this, matrix) # clamp(min, max, x) # degreesToRadians(degrees) # degrees
number
degreesToRadians(degrees) =>
- number
interpolate(a, b, t) # radiansToDegrees(radians) # radians
number
radiansToDegrees(radians) =>
- number
Shape # constructor()
x number
y number
bottom height left right top width add(this, x) # this
#
x number
#
y number
add(this, x, y) =>
addSelf(this, x) # clone(this) # contain(this, other) # containSelf(this, other) # draw(color, position) # intersectPoint(this, other, center) # negate(this) # negateSelf(this) # scale(this, x) # scaleLinear(this, x) # scaleLinearSelf(this, x) # scaleSelf(this, x) # screen(this, other) # screenSelf(this, other) # setLeft(x) # setTop(y) # sub(this, x) # subSelf(this, x) # toCSSStyle()
toCSSStyle() =>
- string
toJSON()
toJSON() =>
toPositionObject() # toSizeObject() # toStyle()
toStyle() =>
Partial<CSSStyleDeclaration>
toStylePct()
toStylePct() =>
Partial<CSSStyleDeclaration>
toStylePosition()
toStylePosition() =>
Partial<CSSStyleDeclaration>
toStylePositionPct()
toStylePositionPct() =>
Partial<CSSStyleDeclaration>
toStyleSize()
toStyleSize() =>
Partial<CSSStyleDeclaration>
toStyleSizePct()
toStyleSizePct() =>
Partial<CSSStyleDeclaration>
touchPoint(this, other, center) # translate(this, x) # translateSelf(this, x) # zoomLinear(this, x) # zoomLinearSelf(this, x) # Vec3 # constructor(x, y, z)
x number
y number
z number
[iterator]()
[iterator]() =>
IterableIterator<number>
interpolate()
interpolate() =>
- number
set(other) # toString()
toString() =>
- string
MorphFn # (from, to)
Placement "nw" | "nwr" | "nel" | "n" | "ne" | "e" | "se" | "s" | "sw" | "w"
ShapeLike {
# height
number
width number
x number
y number
# height
number
width number
x number
y number
# height
number
width number
x number
y number
# toJSON
cardinal(data, closed, tension)
## Credits
- [everyday-types](https://npmjs.org/package/everyday-types) by [stagas](https://github.com/stagas) – Everyday utility types
## Contributing
[Fork](https://github.com/stagas/geometrik/fork) or [edit](https://github.dev/stagas/geometrik) and submit a PR.
All contributions are welcome!
## License
MIT © 2022 [stagas](https://github.com/stagas)