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.