Skip to content

Bounds

Bounds boundary class

Key Properties

x: number

x-axis coordinate.

y: number

y-axis coordinate.

width: number

Width, may be negative.

height: number

Height, may be negative.

Readonly Properties

minX: number

Minimum x-axis coordinate.

minY: number

Minimum y-axis coordinate.

maxX: number

Maximum x-axis coordinate.

maxY: number

Maximum y-axis coordinate.

Key Methods

When returning Bounds, chained operations are supported.

set ( x: number | IBoundsData = 0, y = 0, width = 0, height = 0 ): Bounds

Set boundary data, same parameters as new Bounds(), default is 0,0,0,0.

get ( ): IBoundsData

Get boundary data object {x,y,width,height}.

clone ( ): Bounds

Clone a Bounds object.

put ( put: IBoundsData, align: IAlign = 'center', putScale?: IPutScale )

Place a bounding box into a specified position, and automatically adjust the position and size of put after alignment and scaling.

align represents the alignment position, default is centered placement, putScale represents scaling size, default is 1.

方向图

ts
// Direction
type IAlign =
  | 'top-left'
  | 'top'
  | 'top-right'
  | 'right'
  | 'bottom-right'
  | 'bottom'
  | 'bottom-left'
  | 'left'
  | 'center'
ts
type IPutScale =
  | number // specify scale ratio
  | 'cover' // cover (similar to background-size: cover)
  | 'fit' // fit (similar to background-size: contain)

Scaling

scale ( scaleX: number, scaleY = scaleX, onlySize?: boolean ): Bounds

Scale the current Bounds around the origin (0, 0).

When onlySize is true, only width and height are scaled.

scaleOf ( origin: IPointData, scaleX: number, scaleY = scaleX ): Bounds

Scale the current Bounds around the origin point.

Adjustment

spread ( fourNumber: IFourNumber ): Bounds

Expand the boundary outward.

shrink ( fourNumber: IFourNumber ): Bounds

Shrink the boundary inward.

ceil ( ): Bounds

Round up the boundary so that x, y, width, height all become integers, ensuring it still contains the previous Bounds.

unsign ( ): Bounds

Convert width and height that may be negative into positive values, affecting x and y.

Add

add ( bounds:IBoundsData ): Bounds

Add a bounds.

addList ( boundsList: IBoundsData[] ): Bounds

Add a list of bounds.

setList ( boundsList: IBoundsData[] ): Bounds

Set boundary data from a bounds list.

addListWithFn ( list: IObject[], boundsDataFn: IBoundsDataFn ): Bounds

Add a bounds list via traversal function. When iterating list, the actual BoundsData is returned by calling boundsDataFn.

Usage scenario

The list item itself is not Bounds, but one of its properties is Bounds.

setListWithFn ( list: IObject[], boundsDataFn: IBoundsDataFn ): Bounds

Set boundary data from a bounds list generated by a traversal function.

Coordinates

setPoint ( point: IPointData): Bounds

Set boundary data from a coordinate point, width and height will be 0.

addPoint ( point: IPointData): Bounds

Add a coordinate point.

setPoints ( points: IPointData[] ): Bounds

Set boundary data from a set of coordinate points.

getPoints ( ): IPointData[]

Get the 4 coordinate points [topLeft, topRight, bottomRight, bottomLeft].

getPoint ( around: IAround, onlyBoxSize?: boolean, to?: IPointData ): IPointData

Get the coordinate of the around point in the bounding box.

onlyBoxSize means excluding the starting coordinate of Bounds, default is false.

If to exists, the result will be assigned to to.

Collision Detection

hitPoint ( point: IPointData, pointMatrix?: IMatrixData ): boolean

Check whether it collides with a coordinate point. The passed point supports temporarily applying a matrix pointMatrix.

hitRadiusPoint ( point: IRadiusPointData, pointMatrix?: IMatrixWithScaleData ):boolean

Check whether it collides with a coordinate point with radius. The passed point supports temporarily applying a matrix pointMatrix (requires scaleX and scaleY), commonly used for cursor picking.

hit ( bounds: IBoundsData, boundsMatrix?: IMatrixData ): boolean

Check whether it collides with another bounds. The passed bounds supports temporarily applying a matrix boundsMatrix.

includes ( bounds: IBoundsData, boundsMatrix?: IMatrixData ): boolean

Check whether it contains another bounds. The passed bounds supports temporarily applying a matrix boundsMatrix.

Intersection

intersect ( bounds: IBoundsData, boundsMatrix?: IMatrixData ): Bounds

Perform intersection with another bounds, only keeping the overlapping part. The passed bounds supports temporarily applying a matrix boundsMatrix.

getIntersect ( bounds: IBoundsData, boundsMatrix?: IMatrixData ): Bounds

Get the intersection with another bounds. The passed bounds supports temporarily applying a matrix boundsMatrix.

Check

isSame ( bounds: IBoundsData ): boolean

Check whether it is equal to another bounds.

isEmpty ( ): boolean

Check whether it is an empty bounds, all properties are 0.

reset ( ): void

Reset the boundary.

Matrix Methods

toOuterOf ( matrix: IMatrixData , to?: IBoundsData ): Bounds

Convert to the external AABB bounding box of the matrix (assuming current is internal bounds). If to exists, the result will be assigned to to.

getFitMatrix ( put: IBoundsData ): IMatrix

Place another bounds into the current bounds and return an optimal fit matrix.

Examples

Create via property values

ts
import { Bounds } from 'leafer-ui'

const bounds = new Bounds(0, 0, 100, 100)

Create via data object

ts
const boundsData = { x: 0, y: 0, width: 100, height: 100 }

const bounds = new Bounds(boundsData)

Chained operations

ts
const bounds = new Bounds()

bounds.set(0, 0, 100, 100).hitPoint({ x: 50, y: 50 }) // true

API

Bounds

Released under the MIT License.