Skip to content

ActiveSelectionOptions

Defined in: src/shapes/ActiveSelection.ts:16

absolutePositioned: boolean

Defined in: src/shapes/Object/types/SerializedObjectProps.ts:72

Meaningful ONLY when the object is used as clipPath. if true, the clipPath will have its top and left relative to canvas, and will not be influenced by the object transform. This will make the clipPath relative to the canvas, but clipping just a particular object. WARNING this is beta, this feature may change or be renamed. since 2.4.0

false

GroupProps.absolutePositioned


angle: TDegree

Defined in: src/shapes/Object/types/BaseProps.ts:63

Angle of rotation of an object (in degrees)

0

GroupProps.angle


backgroundColor: string

Defined in: src/shapes/Object/types/SerializedObjectProps.ts:26

Background color of an object. takes css colors https://www.w3.org/TR/css-color-3/

GroupProps.backgroundColor


borderColor: string

Defined in: src/shapes/Object/types/BorderProps.ts:7

Color of controlling borders of an object (when it’s active)

rgb(178,204,255)

GroupProps.borderColor


borderDashArray: null | number[]

Defined in: src/shapes/Object/types/BorderProps.ts:15

Array specifying dash pattern of an object’s borders (hasBorder must be true)

1.6.2

GroupProps.borderDashArray


borderOpacityWhenMoving: number

Defined in: src/shapes/Object/types/BorderProps.ts:29

Opacity of object’s controlling borders when object is active and moving

0.4

GroupProps.borderOpacityWhenMoving


borderScaleFactor: number

Defined in: src/shapes/Object/types/BorderProps.ts:40

Scale factor for the border of the objects ( selection box and controls stroke ). Bigger number will make a thicker border border default value is 1, so this scale value is equal to a border and control strokeWidth. If you need to divide border from control strokeWidth you will need to write your own render function for controls

1

GroupProps.borderScaleFactor


optional canvas: Canvas | StaticCanvas<StaticCanvasEvents>

Defined in: src/shapes/Object/types/ObjectProps.ts:20

GroupProps.canvas


centeredRotation: boolean

Defined in: src/shapes/Object/types/ObjectTransformProps.ts:27

When true the object will rotate on its center. When false will rotate around the origin point defined by originX and originY. The value of this property is IGNORED during a transform if the canvas has already centeredRotation set to true The object method rotate will always consider this property and never the canvas’s one.

1.3.4

GroupProps.centeredRotation


centeredScaling: boolean

Defined in: src/shapes/Object/types/ObjectTransformProps.ts:36

When true, this object will use center point as the origin of transformation when being scaled via the controls.

1.3.4

GroupProps.centeredScaling


optional clipPath: BaseFabricObject<Partial<ObjectProps>, SerializedObjectProps, ObjectEvents>

Defined in: src/shapes/Object/types/ObjectProps.ts:16

a fabricObject that, without stroke define a clipping area with their shape. filled in black the clipPath object gets used when the object has rendered, and the context is placed in the center of the object cacheCanvas. If you want 0,0 of a clipPath to align with an object center, use clipPath.originX/Y to ‘center’

GroupProps.clipPath


cornerColor: string

Defined in: src/shapes/Object/types/ControlProps.ts:28

Color of controlling corners of an object (when it’s active)

rgb(178,204,255)

GroupProps.cornerColor


cornerDashArray: null | number[]

Defined in: src/shapes/Object/types/ControlProps.ts:55

Array specifying dash pattern of an object’s control (hasBorder must be true)

1.6.2

null

GroupProps.cornerDashArray


cornerSize: number

Defined in: src/shapes/Object/types/ControlProps.ts:7

Size of object’s controlling corners (in pixels)

13

GroupProps.cornerSize


cornerStrokeColor: string

Defined in: src/shapes/Object/types/ControlProps.ts:36

Color of controlling corners of an object (when it’s active and transparentCorners false)

1.6.2

''

GroupProps.cornerStrokeColor


cornerStyle: "circle" | "rect"

Defined in: src/shapes/Object/types/ControlProps.ts:47

Specify style of control, ‘rect’ or ‘circle’ This is deprecated. In the future there will be a standard control render And you can swap it with one of the alternative proposed with the control api

1.6.2

'rect'

GroupProps.cornerStyle


evented: boolean

Defined in: src/shapes/Object/types/FabricObjectProps.ts:65

When set to false, an object can not be a target of events. All events propagate through it. Introduced in v1.3.4

GroupProps.evented


excludeFromExport: boolean

Defined in: src/shapes/Object/types/ObjectProps.ts:52

When true, object is not exported in OBJECT/JSON

1.6.3

GroupProps.excludeFromExport


fill: null | string | TFiller

Defined in: src/shapes/Object/types/ObjectProps.ts:17

Color of object’s fill takes css colors https://www.w3.org/TR/css-color-3/

rgb(0,0,0)

GroupProps.fill


fillRule: CanvasFillRule

Defined in: src/shapes/Object/types/FillStrokeProps.ts:26

Fill rule used to fill an object accepted values are nonzero, evenodd Backwards incompatibility note: This property was used for setting globalCompositeOperation until v1.4.12 (use globalCompositeOperation instead)

nonzero

GroupProps.fillRule


flipX: boolean

Defined in: src/shapes/Object/types/BaseProps.ts:70

When true, an object is rendered as flipped horizontally

false

GroupProps.flipX


flipY: boolean

Defined in: src/shapes/Object/types/BaseProps.ts:77

When true, an object is rendered as flipped vertically

false

GroupProps.flipY


globalCompositeOperation: GlobalCompositeOperation

Defined in: src/shapes/Object/types/SerializedObjectProps.ts:18

Composite rule used for canvas globalCompositeOperation

GroupProps.globalCompositeOperation


hasBorders: boolean

Defined in: src/shapes/Object/types/BorderProps.ts:22

When set to false, object’s controlling borders are not rendered

GroupProps.hasBorders


hasControls: boolean

Defined in: src/shapes/Object/types/ControlProps.ts:69

When set to false, object’s controls are not displayed and can not be used to manipulate object

true

GroupProps.hasControls


height: number

Defined in: src/shapes/Object/types/BaseProps.ts:34

Object height

GroupProps.height


hoverCursor: null | string

Defined in: src/shapes/Object/types/FabricObjectProps.ts:27

Default cursor value used when hovering over this object on canvas

null

GroupProps.hoverCursor


includeDefaultValues: boolean

Defined in: src/shapes/Object/types/ObjectProps.ts:44

When false, default object’s values are not included in its serialization

GroupProps.includeDefaultValues


interactive: boolean

Defined in: src/shapes/Group.ts:56

GroupProps.interactive


inverted: boolean

Defined in: src/shapes/Object/types/SerializedObjectProps.ts:60

Meaningful ONLY when the object is used as clipPath. if true, the clipPath will make the object clip to the outside of the clipPath since 2.4.0

false

GroupProps.inverted


layoutManager: LayoutManager

Defined in: src/shapes/Group.ts:67

GroupProps.layoutManager


left: number

Defined in: src/shapes/Object/types/BaseProps.ts:11

Left position of an object. Note that by default it’s relative to object left. You can change this by setting FabricObject#originX

0

GroupProps.left


lockMovementX: boolean

Defined in: src/shapes/Object/types/LockInteractionProps.ts:7

When true, object horizontal movement is locked

GroupProps.lockMovementX


lockMovementY: boolean

Defined in: src/shapes/Object/types/LockInteractionProps.ts:14

When true, object vertical movement is locked

GroupProps.lockMovementY


lockRotation: boolean

Defined in: src/shapes/Object/types/LockInteractionProps.ts:21

When true, object rotation is locked

GroupProps.lockRotation


lockScalingFlip: boolean

Defined in: src/shapes/Object/types/LockInteractionProps.ts:56

When true, object cannot be flipped by scaling into negative values

GroupProps.lockScalingFlip


lockScalingX: boolean

Defined in: src/shapes/Object/types/LockInteractionProps.ts:28

When true, object horizontal scaling is locked

GroupProps.lockScalingX


lockScalingY: boolean

Defined in: src/shapes/Object/types/LockInteractionProps.ts:35

When true, object vertical scaling is locked

GroupProps.lockScalingY


lockSkewingX: boolean

Defined in: src/shapes/Object/types/LockInteractionProps.ts:42

When true, object horizontal skewing is locked

GroupProps.lockSkewingX


lockSkewingY: boolean

Defined in: src/shapes/Object/types/LockInteractionProps.ts:49

When true, object vertical skewing is locked

GroupProps.lockSkewingY


minScaleLimit: number

Defined in: src/shapes/Object/types/ObjectProps.ts:27

Minimum allowed scale value of an object

0

GroupProps.minScaleLimit


moveCursor: null | string

Defined in: src/shapes/Object/types/FabricObjectProps.ts:34

Default cursor value used when moving this object on canvas

null

GroupProps.moveCursor


multiSelectionStacking: MultiSelectionStacking

Defined in: src/shapes/ActiveSelection.ts:17


optional noScaleCache: boolean

Defined in: src/shapes/Object/types/FabricObjectProps.ts:20

When true, cache does not get updated during scaling. The picture will get blocky if scaled too much and will be redrawn with correct details at the end of scaling. this setting is performance and application dependant. default to true since 1.7.0

true

GroupProps.noScaleCache


objectCaching: boolean

Defined in: src/shapes/Object/types/ObjectProps.ts:37

When true, object is cached on an additional canvas. When false, object is not cached unless necessary ( clipPath ) default to true

1.7.0

true

GroupProps.objectCaching


opacity: number

Defined in: src/shapes/Object/types/SerializedObjectProps.ts:11

Opacity of an object

1

GroupProps.opacity


originX: TOriginX

Defined in: src/shapes/Object/types/BaseProps.ts:45

Horizontal origin of transformation of an object (left, center, right or [0, 1]) See http://jsfiddle.net/1ow02gea/244/ on how originX/originY affect objects in groups

'left'

GroupProps.originX


originY: TOriginY

Defined in: src/shapes/Object/types/BaseProps.ts:56

Vertical origin of transformation of an object (top, center, bottom or [0, 1]) See http://jsfiddle.net/1ow02gea/244/ on how originX/originY affect objects in groups

'top'

GroupProps.originY


padding: number

Defined in: src/shapes/Object/types/ControlProps.ts:62

Padding between object and its controlling borders (in pixels)

0

GroupProps.padding


paintFirst: "fill" | "stroke"

Defined in: src/shapes/Object/types/FillStrokeProps.ts:9

Determines if the fill or the stroke is drawn first (one of “fill” or “stroke”)

GroupProps.paintFirst


perPixelTargetFind: boolean

Defined in: src/shapes/Object/types/FabricObjectProps.ts:50

When set to true, objects are “found” on canvas on per-pixel basis rather than according to bounding box

GroupProps.perPixelTargetFind


scaleX: number

Defined in: src/shapes/Object/types/BaseProps.ts:84

Object scale factor (horizontal)

1

GroupProps.scaleX


scaleY: number

Defined in: src/shapes/Object/types/BaseProps.ts:91

Object scale factor (vertical)

1

GroupProps.scaleY


selectable: boolean

Defined in: src/shapes/Object/types/FabricObjectProps.ts:58

When set to false, an object can not be selected for modification (using either point-click-based or group-based selection). But events still fire on it.

GroupProps.selectable


selectionBackgroundColor: string

Defined in: src/shapes/Object/types/FabricObjectProps.ts:43

Selection Background color of an object. colored layer behind the object when it is active. does not mix good with globalCompositeOperation methods.

GroupProps.selectionBackgroundColor


shadow: null | Shadow

Defined in: src/shapes/Object/types/ObjectProps.ts:19

Shadow object representing shadow of this shape

null

GroupProps.shadow


skewX: TDegree

Defined in: src/shapes/Object/types/BaseProps.ts:98

Angle of skew on x axes of an object (in degrees)

0

GroupProps.skewX


skewY: TDegree

Defined in: src/shapes/Object/types/BaseProps.ts:105

Angle of skew on y axes of an object (in degrees)

0

GroupProps.skewY


optional snapAngle: TDegree

Defined in: src/shapes/Object/types/ObjectTransformProps.ts:8

The angle that an object will lock to while rotating.

GroupProps.snapAngle


optional snapThreshold: TDegree

Defined in: src/shapes/Object/types/ObjectTransformProps.ts:15

The angle difference from the current snapped angle in which snapping should occur. When undefined, the snapThreshold will default to the snapAngle.

GroupProps.snapThreshold


stroke: null | string | TFiller

Defined in: src/shapes/Object/types/ObjectProps.ts:18

When defined, an object is rendered via stroke and this property specifies its color takes css colors https://www.w3.org/TR/css-color-3/

null

GroupProps.stroke


strokeDashArray: null | number[]

Defined in: src/shapes/Object/types/FillStrokeProps.ts:48

Array specifying dash pattern of an object’s stroke (stroke must be defined)

null;

GroupProps.strokeDashArray


strokeDashOffset: number

Defined in: src/shapes/Object/types/FillStrokeProps.ts:55

Line offset of an object’s stroke

0

GroupProps.strokeDashOffset


strokeLineCap: CanvasLineCap

Defined in: src/shapes/Object/types/FillStrokeProps.ts:62

Line endings style of an object’s stroke (one of “butt”, “round”, “square”)

butt

GroupProps.strokeLineCap


strokeLineJoin: CanvasLineJoin

Defined in: src/shapes/Object/types/FillStrokeProps.ts:69

Corner style of an object’s stroke (one of “bevel”, “round”, “miter”)

GroupProps.strokeLineJoin


strokeMiterLimit: number

Defined in: src/shapes/Object/types/FillStrokeProps.ts:76

Maximum miter length (used for strokeLineJoin = “miter”) of an object’s stroke

4

GroupProps.strokeMiterLimit


strokeUniform: boolean

Defined in: src/shapes/Object/types/FillStrokeProps.ts:89

When false, the stoke width will scale with the object. When true, the stroke will always match the exact pixel size entered for stroke width. this Property does not work on Text classes or drawing call that uses strokeText,fillText methods default to false

2.6.0

false
false

GroupProps.strokeUniform


strokeWidth: number

Defined in: src/shapes/Object/types/FillStrokeProps.ts:41

Width of a stroke used to render this object

1

GroupProps.strokeWidth


subTargetCheck: boolean

Defined in: src/shapes/Group.ts:55

GroupProps.subTargetCheck


top: number

Defined in: src/shapes/Object/types/BaseProps.ts:20

Top position of an object. Note that by default it’s relative to object top. You can change this by setting FabricObject#originY

0

GroupProps.top


touchCornerSize: number

Defined in: src/shapes/Object/types/ControlProps.ts:14

Size of object’s controlling corners when touch interaction is detected

24

GroupProps.touchCornerSize


transparentCorners: boolean

Defined in: src/shapes/Object/types/ControlProps.ts:21

When true, object’s controlling corners are rendered as transparent inside (i.e. stroke instead of fill)

true

GroupProps.transparentCorners


visible: boolean

Defined in: src/shapes/Object/types/SerializedObjectProps.ts:40

When set to false, an object is not rendered on canvas

GroupProps.visible


width: number

Defined in: src/shapes/Object/types/BaseProps.ts:27

Object width

GroupProps.width