ImageProps
Defined in: src/shapes/Image.ts:70
Extends
Section titled “Extends”FabricObjectProps.UniqueImageProps
Properties
Section titled “Properties”absolutePositioned
Section titled “absolutePositioned”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
Default
Section titled “Default”falseInherited from
Section titled “Inherited from”FabricObjectProps.absolutePositioned
angle:
TDegree
Defined in: src/shapes/Object/types/BaseProps.ts:63
Angle of rotation of an object (in degrees)
Default
Section titled “Default”0Inherited from
Section titled “Inherited from”backgroundColor
Section titled “backgroundColor”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/
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.backgroundColor
borderColor
Section titled “borderColor”borderColor:
string
Defined in: src/shapes/Object/types/BorderProps.ts:7
Color of controlling borders of an object (when it’s active)
Default
Section titled “Default”rgb(178,204,255)Inherited from
Section titled “Inherited from”borderDashArray
Section titled “borderDashArray”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
Inherited from
Section titled “Inherited from”FabricObjectProps.borderDashArray
borderOpacityWhenMoving
Section titled “borderOpacityWhenMoving”borderOpacityWhenMoving:
number
Defined in: src/shapes/Object/types/BorderProps.ts:29
Opacity of object’s controlling borders when object is active and moving
Default
Section titled “Default”0.4Inherited from
Section titled “Inherited from”FabricObjectProps.borderOpacityWhenMoving
borderScaleFactor
Section titled “borderScaleFactor”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
Default
Section titled “Default”1Inherited from
Section titled “Inherited from”FabricObjectProps.borderScaleFactor
canvas?
Section titled “canvas?”
optionalcanvas:Canvas|StaticCanvas<StaticCanvasEvents>
Defined in: src/shapes/Object/types/ObjectProps.ts:20
Inherited from
Section titled “Inherited from”centeredRotation
Section titled “centeredRotation”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
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.centeredRotation
centeredScaling
Section titled “centeredScaling”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
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.centeredScaling
clipPath?
Section titled “clipPath?”
optionalclipPath: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’
Inherited from
Section titled “Inherited from”cornerColor
Section titled “cornerColor”cornerColor:
string
Defined in: src/shapes/Object/types/ControlProps.ts:28
Color of controlling corners of an object (when it’s active)
Default
Section titled “Default”rgb(178,204,255)Inherited from
Section titled “Inherited from”cornerDashArray
Section titled “cornerDashArray”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
Default
Section titled “Default”nullInherited from
Section titled “Inherited from”FabricObjectProps.cornerDashArray
cornerSize
Section titled “cornerSize”cornerSize:
number
Defined in: src/shapes/Object/types/ControlProps.ts:7
Size of object’s controlling corners (in pixels)
Default
Section titled “Default”13Inherited from
Section titled “Inherited from”cornerStrokeColor
Section titled “cornerStrokeColor”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
Default
Section titled “Default”''Inherited from
Section titled “Inherited from”FabricObjectProps.cornerStrokeColor
cornerStyle
Section titled “cornerStyle”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
Default
Section titled “Default”'rect'Inherited from
Section titled “Inherited from”cropX:
number
Defined in: src/shapes/Image.ts:45
Inherited from
Section titled “Inherited from”UniqueImageProps.cropX
cropY:
number
Defined in: src/shapes/Image.ts:46
Inherited from
Section titled “Inherited from”UniqueImageProps.cropY
evented
Section titled “evented”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
Default
Section titled “Default”Inherited from
Section titled “Inherited from”excludeFromExport
Section titled “excludeFromExport”excludeFromExport:
boolean
Defined in: src/shapes/Object/types/ObjectProps.ts:52
When true, object is not exported in OBJECT/JSON
1.6.3
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.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/
Default
Section titled “Default”rgb(0,0,0)Inherited from
Section titled “Inherited from”fillRule
Section titled “fillRule”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)
Default
Section titled “Default”nonzeroInherited from
Section titled “Inherited from”filters
Section titled “filters”filters:
BaseFilter<string,Record<string,any>,Record<string,any>>[]
Defined in: src/shapes/Image.ts:48
Inherited from
Section titled “Inherited from”UniqueImageProps.filters
flipX:
boolean
Defined in: src/shapes/Object/types/BaseProps.ts:70
When true, an object is rendered as flipped horizontally
Default
Section titled “Default”falseInherited from
Section titled “Inherited from”flipY:
boolean
Defined in: src/shapes/Object/types/BaseProps.ts:77
When true, an object is rendered as flipped vertically
Default
Section titled “Default”falseInherited from
Section titled “Inherited from”globalCompositeOperation
Section titled “globalCompositeOperation”globalCompositeOperation:
GlobalCompositeOperation
Defined in: src/shapes/Object/types/SerializedObjectProps.ts:18
Composite rule used for canvas globalCompositeOperation
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.globalCompositeOperation
hasBorders
Section titled “hasBorders”hasBorders:
boolean
Defined in: src/shapes/Object/types/BorderProps.ts:22
When set to false, object’s controlling borders are not rendered
Default
Section titled “Default”Inherited from
Section titled “Inherited from”hasControls
Section titled “hasControls”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
Default
Section titled “Default”trueInherited from
Section titled “Inherited from”height
Section titled “height”height:
number
Defined in: src/shapes/Object/types/BaseProps.ts:34
Object height
Default
Section titled “Default”Inherited from
Section titled “Inherited from”hoverCursor
Section titled “hoverCursor”hoverCursor:
null|string
Defined in: src/shapes/Object/types/FabricObjectProps.ts:27
Default cursor value used when hovering over this object on canvas
Default
Section titled “Default”nullInherited from
Section titled “Inherited from”imageSmoothing
Section titled “imageSmoothing”imageSmoothing:
boolean
Defined in: src/shapes/Image.ts:47
Inherited from
Section titled “Inherited from”UniqueImageProps.imageSmoothing
includeDefaultValues
Section titled “includeDefaultValues”includeDefaultValues:
boolean
Defined in: src/shapes/Object/types/ObjectProps.ts:44
When false, default object’s values are not included in its serialization
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.includeDefaultValues
inverted
Section titled “inverted”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
Default
Section titled “Default”falseInherited from
Section titled “Inherited from”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
Default
Section titled “Default”0Inherited from
Section titled “Inherited from”lockMovementX
Section titled “lockMovementX”lockMovementX:
boolean
Defined in: src/shapes/Object/types/LockInteractionProps.ts:7
When true, object horizontal movement is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.lockMovementX
lockMovementY
Section titled “lockMovementY”lockMovementY:
boolean
Defined in: src/shapes/Object/types/LockInteractionProps.ts:14
When true, object vertical movement is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.lockMovementY
lockRotation
Section titled “lockRotation”lockRotation:
boolean
Defined in: src/shapes/Object/types/LockInteractionProps.ts:21
When true, object rotation is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.lockRotation
lockScalingFlip
Section titled “lockScalingFlip”lockScalingFlip:
boolean
Defined in: src/shapes/Object/types/LockInteractionProps.ts:56
When true, object cannot be flipped by scaling into negative values
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.lockScalingFlip
lockScalingX
Section titled “lockScalingX”lockScalingX:
boolean
Defined in: src/shapes/Object/types/LockInteractionProps.ts:28
When true, object horizontal scaling is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.lockScalingX
lockScalingY
Section titled “lockScalingY”lockScalingY:
boolean
Defined in: src/shapes/Object/types/LockInteractionProps.ts:35
When true, object vertical scaling is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.lockScalingY
lockSkewingX
Section titled “lockSkewingX”lockSkewingX:
boolean
Defined in: src/shapes/Object/types/LockInteractionProps.ts:42
When true, object horizontal skewing is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.lockSkewingX
lockSkewingY
Section titled “lockSkewingY”lockSkewingY:
boolean
Defined in: src/shapes/Object/types/LockInteractionProps.ts:49
When true, object vertical skewing is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.lockSkewingY
minimumScaleTrigger
Section titled “minimumScaleTrigger”minimumScaleTrigger:
number
Defined in: src/shapes/Image.ts:44
Inherited from
Section titled “Inherited from”UniqueImageProps.minimumScaleTrigger
minScaleLimit
Section titled “minScaleLimit”minScaleLimit:
number
Defined in: src/shapes/Object/types/ObjectProps.ts:27
Minimum allowed scale value of an object
Default
Section titled “Default”0Inherited from
Section titled “Inherited from”FabricObjectProps.minScaleLimit
moveCursor
Section titled “moveCursor”moveCursor:
null|string
Defined in: src/shapes/Object/types/FabricObjectProps.ts:34
Default cursor value used when moving this object on canvas
Default
Section titled “Default”nullInherited from
Section titled “Inherited from”noScaleCache?
Section titled “noScaleCache?”
optionalnoScaleCache: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
Default
Section titled “Default”trueInherited from
Section titled “Inherited from”FabricObjectProps.noScaleCache
objectCaching
Section titled “objectCaching”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
Default
Section titled “Default”trueInherited from
Section titled “Inherited from”FabricObjectProps.objectCaching
opacity
Section titled “opacity”opacity:
number
Defined in: src/shapes/Object/types/SerializedObjectProps.ts:11
Opacity of an object
Default
Section titled “Default”1Inherited from
Section titled “Inherited from”originX
Section titled “originX”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
Default
Section titled “Default”'left'Inherited from
Section titled “Inherited from”originY
Section titled “originY”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
Default
Section titled “Default”'top'Inherited from
Section titled “Inherited from”padding
Section titled “padding”padding:
number
Defined in: src/shapes/Object/types/ControlProps.ts:62
Padding between object and its controlling borders (in pixels)
Default
Section titled “Default”0Inherited from
Section titled “Inherited from”paintFirst
Section titled “paintFirst”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”)
Default
Section titled “Default”Inherited from
Section titled “Inherited from”perPixelTargetFind
Section titled “perPixelTargetFind”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
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.perPixelTargetFind
resizeFilter?
Section titled “resizeFilter?”
optionalresizeFilter:Resize
Defined in: src/shapes/Image.ts:49
Inherited from
Section titled “Inherited from”UniqueImageProps.resizeFilter
scaleX
Section titled “scaleX”scaleX:
number
Defined in: src/shapes/Object/types/BaseProps.ts:84
Object scale factor (horizontal)
Default
Section titled “Default”1Inherited from
Section titled “Inherited from”scaleY
Section titled “scaleY”scaleY:
number
Defined in: src/shapes/Object/types/BaseProps.ts:91
Object scale factor (vertical)
Default
Section titled “Default”1Inherited from
Section titled “Inherited from”selectable
Section titled “selectable”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.
Default
Section titled “Default”Inherited from
Section titled “Inherited from”selectionBackgroundColor
Section titled “selectionBackgroundColor”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.
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.selectionBackgroundColor
shadow
Section titled “shadow”shadow:
null|Shadow
Defined in: src/shapes/Object/types/ObjectProps.ts:19
Shadow object representing shadow of this shape
Default
Section titled “Default”nullInherited from
Section titled “Inherited from”skewX:
TDegree
Defined in: src/shapes/Object/types/BaseProps.ts:98
Angle of skew on x axes of an object (in degrees)
Default
Section titled “Default”0Inherited from
Section titled “Inherited from”skewY:
TDegree
Defined in: src/shapes/Object/types/BaseProps.ts:105
Angle of skew on y axes of an object (in degrees)
Default
Section titled “Default”0Inherited from
Section titled “Inherited from”snapAngle?
Section titled “snapAngle?”
optionalsnapAngle:TDegree
Defined in: src/shapes/Object/types/ObjectTransformProps.ts:8
The angle that an object will lock to while rotating.
Inherited from
Section titled “Inherited from”snapThreshold?
Section titled “snapThreshold?”
optionalsnapThreshold: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.
Inherited from
Section titled “Inherited from”FabricObjectProps.snapThreshold
srcFromAttribute
Section titled “srcFromAttribute”srcFromAttribute:
boolean
Defined in: src/shapes/Image.ts:43
Inherited from
Section titled “Inherited from”UniqueImageProps.srcFromAttribute
stroke
Section titled “stroke”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/
Default
Section titled “Default”nullInherited from
Section titled “Inherited from”strokeDashArray
Section titled “strokeDashArray”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)
Default
Section titled “Default”null;Inherited from
Section titled “Inherited from”FabricObjectProps.strokeDashArray
strokeDashOffset
Section titled “strokeDashOffset”strokeDashOffset:
number
Defined in: src/shapes/Object/types/FillStrokeProps.ts:55
Line offset of an object’s stroke
Default
Section titled “Default”0Inherited from
Section titled “Inherited from”FabricObjectProps.strokeDashOffset
strokeLineCap
Section titled “strokeLineCap”strokeLineCap:
CanvasLineCap
Defined in: src/shapes/Object/types/FillStrokeProps.ts:62
Line endings style of an object’s stroke (one of “butt”, “round”, “square”)
Default
Section titled “Default”buttInherited from
Section titled “Inherited from”FabricObjectProps.strokeLineCap
strokeLineJoin
Section titled “strokeLineJoin”strokeLineJoin:
CanvasLineJoin
Defined in: src/shapes/Object/types/FillStrokeProps.ts:69
Corner style of an object’s stroke (one of “bevel”, “round”, “miter”)
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObjectProps.strokeLineJoin
strokeMiterLimit
Section titled “strokeMiterLimit”strokeMiterLimit:
number
Defined in: src/shapes/Object/types/FillStrokeProps.ts:76
Maximum miter length (used for strokeLineJoin = “miter”) of an object’s stroke
Default
Section titled “Default”4Inherited from
Section titled “Inherited from”FabricObjectProps.strokeMiterLimit
strokeUniform
Section titled “strokeUniform”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
Default
Section titled “Default”falseDefault
Section titled “Default”falseInherited from
Section titled “Inherited from”FabricObjectProps.strokeUniform
strokeWidth
Section titled “strokeWidth”strokeWidth:
number
Defined in: src/shapes/Object/types/FillStrokeProps.ts:41
Width of a stroke used to render this object
Default
Section titled “Default”1Inherited from
Section titled “Inherited from”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
Default
Section titled “Default”0Inherited from
Section titled “Inherited from”touchCornerSize
Section titled “touchCornerSize”touchCornerSize:
number
Defined in: src/shapes/Object/types/ControlProps.ts:14
Size of object’s controlling corners when touch interaction is detected
Default
Section titled “Default”24Inherited from
Section titled “Inherited from”FabricObjectProps.touchCornerSize
transparentCorners
Section titled “transparentCorners”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)
Default
Section titled “Default”trueInherited from
Section titled “Inherited from”FabricObjectProps.transparentCorners
visible
Section titled “visible”visible:
boolean
Defined in: src/shapes/Object/types/SerializedObjectProps.ts:40
When set to false, an object is not rendered on canvas
Default
Section titled “Default”Inherited from
Section titled “Inherited from”width:
number
Defined in: src/shapes/Object/types/BaseProps.ts:27
Object width
Default
Section titled “Default”