# Class Rect

GoJS® Diagramming Components
version 3.0.5
by Northwoods Software®

A Rect describes a rectangular two-dimensional area as a top-left point (x and y values) and a size (width and height values).

Use the static functions Rect.parse and Rect.stringify to convert to and from a standard string representation that is independent of the current locale.

When an instance of this class is the value of a property of a GraphObject class or Diagram or CommandHandler or a Tool class, you should treat the object as if it were frozen or read-only -- you cannot modify its properties. This allows the property to return a value without allocating a new instance. If you need to do your own calculations with the value, call copy to make a new instance with the same values that you can modify.

Many methods modify the object's properties and then return a reference to "this" object. The only instance method to allocate a new object is the copy method. The static Rect.parse method also allocates a new object. The center, position, and size properties all allocate and return a new object.

The "Debug" implementation of this class is significantly slower than the "Release" implementation, mostly due to additional error checking.

You cannot inherit from this class.

#####
Index

### Constructors

constructor

### Accessors

bottom
center
centerX
centerY
height
left
position
right
size
top
width
x
y

### Methods

addMargin
contains
containsPoint
containsRect
copy
equalTo
equals
grow
inflate
intersect
intersectRect
intersects
intersectsRect
isEmpty
isReal
offset
set
setPoint
setSize
setSpot
setTo
subtractMargin
union
unionPoint
unionRect
contains
intersects
intersectsLineSegment
parse
stringify
stringifyFixed

## Constructors

### constructor

- new Rect(x?: number | Point, y?: number | Point | Size, w?: number, h?: number): Rect

- There are four constructors: (), (Point, Point), (Point, Size), and four numbers for (x, y, width, height). The default constructor (no argument) results in a Rect(0,0,0,0).

  #### Parameters

  - ##### `Optional` x: number | Point

    Top-left Point, or x value.

  - ##### `Optional` y: number | Point | Size

    Bottom-right Point or Size or y value.

  - ##### `Optional` w: number

    Width to be used if x,y are specified; must be non-negative.

  - ##### `Optional` h: number

    Height to be used if x,y are specified; must be non-negative.

  #### Returns Rect

## Accessors

### bottom
: number

- Gets or sets the y-axis value of the bottom of the Rect. This is equal to the sum of the y value and the height.

### center
: Point

- Gets or sets the Point at the center of this Rect. Setting this property just shifts the X and Y values.

### centerX
: number

- Gets or sets the horizontal center X coordinate of the Rect.

### centerY
: number

- Gets or sets the vertical center Y coordinate of the Rect.

### height
: number

- Gets or sets the height of the Rect. The value must not be negative.

### left
: number

- Gets or sets the leftmost value of the Rect. This is the same as the X value.

### position
: Point

- Gets or sets the x- and y-axis position of the Rect as a Point.

### right
: number

- Gets or sets the x-axis value of the right of the Rect. This is equal to the sum of the x value and the width.

### size
: Size

- Gets or sets the width and height of the Rect as a Size.

### top
: number

- Gets or sets the topmost value of the Rect. This is the same as the Y value.

### width
: number

- Gets or sets the width of the Rect. The value must not be negative.

### x
: number

- Gets or sets the top-left x coordinate of the Rect.

### y
: number

- Gets or sets the top-left y coordinate of the Rect.

## Methods

### addMargin

- addMargin(m: Margin): Rect

- Modify this Rect by adding the given Margin to each side of the Rect.

  #### Parameters

  - ##### m: Margin

    The Margin to add to the Rect.

  #### Returns Rect

  this bigger Rect.

  `see`
  - subtractMargin
  - grow
  - inflate

### contains

- contains(x: number, y: number, w?: number, h?: number): boolean

- Indicates whether this Rect contains the given Point/Rect.

  #### Parameters

  - ##### x: number

    The X coordinate of the Point or Rect to include in the new bounds.

  - ##### y: number

    The Y coordinate of the Point or Rect to include in the new bounds.

  - ##### `Optional` w: number

    The Width of the Rect to include in the new bounds, defaults to zero.

  - ##### `Optional` h: number

    The Height of the Rect to include in the new bounds, defaults to zero.

  #### Returns boolean

  True if the Point/Rect is contained within this Rect, false otherwise.

  `see`
  - containsRect
  - containsPoint

### containsPoint

- containsPoint(p: Point): boolean

- Indicates whether this Rect contains the given Point.

  #### Parameters

  - ##### p: Point

    The Point to check.

  #### Returns boolean

  True if the Point is contained within this Rect, false otherwise.

  `see`
  - containsRect
  - contains

### containsRect

- containsRect(r: Rect): boolean

- Indicates whether this Rect contains the given Rect.

  #### Parameters

  - ##### r: Rect

    The Rect to check.

  #### Returns boolean

  True if the Rect is contained within this Rect, false otherwise.

  `see`
  - containsPoint
  - contains

### `Virtual` copy

- copy(): Rect

- Create a copy of this Rect, with the same values.

  #### Returns Rect

### equalTo

- equalTo(x: number, y: number, w: number, h: number): boolean

- Indicates whether the given Rect is equal to the current Rect.

  #### Parameters

  - ##### x: number

  - ##### y: number

  - ##### w: number

    the width.

  - ##### h: number

    the height.

  #### Returns boolean

  True if the Rects are equivalent in x, y, width, and height.

  `see`

  equals

### equals

- equals(r: Rect): boolean

- Indicates whether the given Rect is equal to the current Rect.

  #### Parameters

  - ##### r: Rect

    The rectangle to compare to the current rectangle.

  #### Returns boolean

  True if the Rects are equivalent in x, y, width, and height.

  `see`

  equalTo

### grow

- grow(t: number, r: number, b: number, l: number): Rect

- Modifies this Rect by adding some distance to each side of the Rect.

  #### Parameters

  - ##### t: number

    the amount to move the top side upwards; may be negative.

  - ##### r: number

    the amount to move the right side rightwards; may be negative.

  - ##### b: number

    the amount to move the bottom side downwards; may be negative.

  - ##### l: number

    the amount to move the left side leftwards; may be negative.

  #### Returns Rect

  this modified Rect.

  `see`
  - inflate
  - addMargin
  - subtractMargin

### inflate

- inflate(w: number, h: number): Rect

- Modify this Rect so that its width and height are changed on all four sides, equally on the left and right sides, and equally on the top and bottom sides. When the arguments are negative, this operation deflates this Rect, but not beyond zero.

  #### Parameters

  - ##### w: number

    The additional width on each side, left and right; may be negative.

  - ##### h: number

    The additional height on each side, top and bottom; may be negative.

  #### Returns Rect

  this.

  `since`

  2.3

  `see`
  - grow
  - addMargin
  - subtractMargin

### intersect

- intersect(x: number, y: number, w: number, h: number): Rect

- Modify this Rect so that it is the intersection of this Rect and the rectangle defined by x, y, w, h.

  #### Parameters

  - ##### x: number

  - ##### y: number

  - ##### w: number

  - ##### h: number

  #### Returns Rect

  this.

  `see`
  - intersectRect
  - intersects

### intersectRect

- intersectRect(r: Rect): Rect

- Modify this Rect so that it is the intersection of this Rect and the given Rect.

  #### Parameters

  - ##### r: Rect

    Rect to intersect with.

  #### Returns Rect

  this.

  `see`
  - intersect
  - intersects

### intersects

- intersects(x: number, y: number, w: number, h: number): boolean

- Determine if this Rect partly or wholly overlaps the rectangle defined by x, y, w, h.

  #### Parameters

  - ##### x: number

  - ##### y: number

  - ##### w: number

  - ##### h: number

  #### Returns boolean

  true if there is any overlap.

  `see`
  - intersectsRect
  - intersect

### intersectsRect

- intersectsRect(r: Rect): boolean

- Determine if a given Rect is partly or wholly inside of this Rect.

  #### Parameters

  - ##### r: Rect

    Rect to test intersection with.

  #### Returns boolean

  true if there is an intersection.

  `see`
  - intersects
  - intersectRect

### isEmpty

- isEmpty(): boolean

- True if this Rect has a Width and Height of zero.

  #### Returns boolean

### isReal

- isReal(): boolean

- True if this Rect has X, Y, Width, and Height values that are real numbers and not infinity.

  #### Returns boolean

### offset

- offset(dx: number, dy: number): Rect

- Modify this Rect by shifting its values with the given DX and DY offsets.

  #### Parameters

  - ##### dx: number

  - ##### dy: number

  #### Returns Rect

  this.

### set

- set(r: Rect): Rect

- Modify this Rect so that its X, Y, Width, and Height values are the same as the given Rect.

  #### Parameters

  - ##### r: Rect

    the given Rect.

  #### Returns Rect

  this.

### setPoint

- setPoint(p: Point): Rect

- Modify this Rect so that its X and Y values are the same as the given Point.

  #### Parameters

  - ##### p: Point

    the given Point.

  #### Returns Rect

  this.

### setSize

- setSize(s: Size): Rect

- Modify this Rect so that its Width and Height values are the same as the given Size.

  #### Parameters

  - ##### s: Size

    the given Size.

  #### Returns Rect

  this.

### setSpot

- setSpot(x: number, y: number, spot: Spot): Rect

- Modify this Rect so that a given Spot is at a given (x,y) point using this Rect's size. Return this rectangle for which the spot is at that point, without modifying the size.

  The result is meaningless if Spot.isNoSpot is true.

  #### Parameters

  - ##### x: number

    the point where the spot should be.

  - ##### y: number

    the point where the spot should be.

  - ##### spot: Spot

    a Spot; Spot.isSpot must be true.

  #### Returns Rect

  this.

### setTo

- setTo(x: number, y: number, w: number, h: number): Rect

- Modify this Rect with new X, Y, Width, and Height values.

  #### Parameters

  - ##### x: number

  - ##### y: number

  - ##### w: number

    the width.

  - ##### h: number

    the height.

  #### Returns Rect

  this.

### subtractMargin

- subtractMargin(m: Margin): Rect

- Modify this Rect by subtracting the given Margin from each side of the Rect.

  #### Parameters

  - ##### m: Margin

    The Margin to subtract from the Rect.

  #### Returns Rect

  this smaller Rect.

  `see`
  - addMargin
  - grow
  - inflate

### union

- union(x: number, y: number, w?: number, h?: number): Rect

- Modify this Rect to be exactly big enough to contain both the original Rect and the given rectangular area.

  #### Parameters

  - ##### x: number

    The X coordinate of the Point or Rect to include in the new bounds.

  - ##### y: number

    The Y coordinate of the Point or Rect to include in the new bounds.

  - ##### `Optional` w: number

    The Width of the Rect to include in the new bounds, defaults to zero.

  - ##### `Optional` h: number

    The Height of the Rect to include in the new bounds, defaults to zero.

  #### Returns Rect

  this.

  `see`
  - unionRect
  - unionPoint

### unionPoint

- unionPoint(p: Point): Rect

- Modify this Rect to be exactly big enough to contain both the original Rect and the given Point.

  #### Parameters

  - ##### p: Point

    The Point to include in the new bounds.

  #### Returns Rect

  this.

  `see`
  - unionRect
  - union

### unionRect

- unionRect(r: Rect): Rect

- Modify this Rect to be exactly big enough to contain this Rect and the given Rect.

  #### Parameters

  - ##### r: Rect

    The Rect to include in the new bounds.

  #### Returns Rect

  this.

  `see`
  - unionPoint
  - union

### `Static` contains

- contains(rx: number, ry: number, rw: number, rh: number, x: number, y: number, w?: number, h?: number): boolean

- This static function indicates whether a Rect contains the given Point/Rect.

  #### Parameters

  - ##### rx: number

    The X coordinate of a Rect.

  - ##### ry: number

    The Y coordinate of a Rect.

  - ##### rw: number

    The Width of a Rect.

  - ##### rh: number

    The Height of a Rect.

  - ##### x: number

    The X coordinate of the Point or Rect that might be in the bounds (RX, RY, RW, RH).

  - ##### y: number

    The Y coordinate of the Point or Rect that might be in the bounds (RX, RY, RW, RH).

  - ##### `Optional` w: number

    The Width of the Rect to include in the new bounds, defaults to zero.

  - ##### `Optional` h: number

    The Height of the Rect to include in the new bounds, defaults to zero.

  #### Returns boolean

  True if the Point/Rect is contained within this Rect, false otherwise.

### `Static` intersects

- intersects(rx: number, ry: number, rw: number, rh: number, x: number, y: number, w: number, h: number): boolean

- This static function indicates whether a Rect partly or wholly overlaps the given Rect.

  #### Parameters

  - ##### rx: number

    The X coordinate of a Rect.

  - ##### ry: number

    The Y coordinate of a Rect.

  - ##### rw: number

    The Width of a Rect.

  - ##### rh: number

    The Height of a Rect.

  - ##### x: number

    The X coordinate of the Point or Rect that might overlap the bounds (RX, RY, RW, RH).

  - ##### y: number

    The Y coordinate of the Point or Rect that might overlap the bounds (RX, RY, RW, RH).

  - ##### w: number

  - ##### h: number

  #### Returns boolean

  true if there is any overlap.

### `Static` intersectsLineSegment

- intersectsLineSegment(x: number, y: number, w: number, h: number, p1x: number, p1y: number, p2x: number, p2y: number): boolean

- This static function is true if a rectangular area is intersected by a finite straight line segment.

  #### Parameters

  - ##### x: number

    The X coordinate of the rectangle to check for intersection with the line segment.

  - ##### y: number

    The Y coordinate of the rectangle to check for intersection with the line segment.

  - ##### w: number

    The Width of the rectangle to check for intersection with the line segment.

  - ##### h: number

    The Height of the rectangle to check for intersection with the line segment.

  - ##### p1x: number

    The X coordinate of one end of the line segment.

  - ##### p1y: number

    The Y coordinate of one end of the line segment.

  - ##### p2x: number

    The X coordinate of other end of the line segment.

  - ##### p2y: number

    The Y coordinate of other end of the line segment.

  #### Returns boolean

  True if the given finite line segment intersects with the given rectangular area, false otherwise.

  `since`

  2.2

### `Static` parse

- parse(str: string): Rect

- This static function can be used to read in a Rect from a string that was produced by Rect.stringify.

  `go.Rect.parse("1 2 3 4")` produces the Rect `new go.Rect(1, 2, 3, 4)`.

  #### Parameters

  - ##### str: string

  #### Returns Rect

### `Static` stringify

- stringify(val: Rect): string

- This static function can be used to write out a Rect as a string that can be read by Rect.parse.

  `go.Rect.stringify(new go.Rect(1, 2, 3, 4))` produces the string "1 2 3 4".

  #### Parameters

  - ##### val: Rect

  #### Returns string

### `Static` stringifyFixed

- stringifyFixed(digits: number): ((val: Rect) => string)

- This static function returns a function that can be used as a back converter for a Binding to write out a Rect's values as numbers with a fixed number of digits after the decimal point.

  This is useful for limiting the size of JSON output and making it more legible. It might also be useful for regression testing.

  #### Parameters

  - ##### digits: number

    must be a non-negative integer

  #### Returns ((val: Rect) => string)

  a function that converts a Rect to a string without so many decimals

  - - (val: Rect): string

    - This static function returns a function that can be used as a back converter for a Binding to write out a Rect's values as numbers with a fixed number of digits after the decimal point.

      This is useful for limiting the size of JSON output and making it more legible. It might also be useful for regression testing.

      #### Parameters

      - ##### val: Rect

      #### Returns string

      a function that converts a Rect to a string without so many decimals

      `since`

      3.0

  `since`

  3.0

Copyright © 1998-2024 by Northwoods Software Corporation.