Line
Defined in: src/shapes/Line.ts:29
Root object class from which all 2d shape classes inherit from
Tutorial
Section titled “Tutorial”http://fabricjs.com/fabric-intro-part-1#objects
added
removed
selected
deselected
rotating
scaling
moving
skewing
modified
mousedown
mouseup
mouseover
mouseout
mousewheel
mousedblclick
dragover
dragenter
dragleave
drop
Extends
Section titled “Extends”FabricObject<Props,SProps,EventSpec>
Type Parameters
Section titled “Type Parameters”Props extends TOptions<FabricObjectProps> = Partial<FabricObjectProps>
SProps
Section titled “SProps”SProps extends SerializedLineProps = SerializedLineProps
EventSpec
Section titled “EventSpec”EventSpec extends ObjectEvents = ObjectEvents
Implements
Section titled “Implements”UniqueLineProps
Constructors
Section titled “Constructors”Constructor
Section titled “Constructor”new Line<
Props,SProps,EventSpec>(points?,options?):Line<Props,SProps,EventSpec>
Defined in: src/shapes/Line.ts:74
Constructor
Parameters
Section titled “Parameters”points?
Section titled “points?”[number, number, number, number] = ...
Array of points
options?
Section titled “options?”Partial<Props> = {}
Options object
Returns
Section titled “Returns”Line<Props, SProps, EventSpec>
thisArg
Overrides
Section titled “Overrides”Properties
Section titled “Properties”__corner?
Section titled “__corner?”
optional__corner:string
Defined in: src/shapes/Object/InteractiveObject.ts:105
keeps the value of the last hovered corner during mouse move. 0 is no corner, or ‘mt’, ‘ml’, ‘mtr’ etc.. It should be private, but there is no harm in using it as a read-only property. this isn’t cleaned automatically. Non selected objects may have wrong values
Inherited from
Section titled “Inherited from”_controlsVisibility
Section titled “_controlsVisibility”_controlsVisibility:
Record<string,boolean>
Defined in: src/shapes/Object/InteractiveObject.ts:112
a map of control visibility for this object. this was left when controls were introduced to not break the api too much this takes priority over the generic control visibility
Inherited from
Section titled “Inherited from”FabricObject._controlsVisibility
_scaling?
Section titled “_scaling?”
optional_scaling:boolean
Defined in: src/shapes/Object/InteractiveObject.ts:134
A boolean used from the gesture module to keep tracking of a scaling action when there is no scaling transform in place. This is an edge case and is used twice in all codebase. Probably added to keep track of some performance issues
use git blame to investigate why it was added DON’T USE IT. WE WILL TRY TO REMOVE IT
Inherited from
Section titled “Inherited from”absolutePositioned
Section titled “absolutePositioned”absolutePositioned:
boolean
Defined in: src/shapes/Object/Object.ts:215
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”FabricObject.absolutePositioned
aCoords
Section titled “aCoords”aCoords:
TCornerPoint
Defined in: src/shapes/Object/ObjectGeometry.ts:63
Describe object’s corner position in scene coordinates. The coordinates are derived from the following: left, top, width, height, scaleX, scaleY, skewX, skewY, angle, strokeWidth. The coordinates do not depend on viewport changes. The coordinates get updated with setCoords. You can calculate them without updating with ()
Inherited from
Section titled “Inherited from”angle:
TDegree
Defined in: src/shapes/Object/ObjectGeometry.ts:583
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/Object.ts:202
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”borderColor
Section titled “borderColor”borderColor:
string
Defined in: src/shapes/Object/InteractiveObject.ts:74
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/InteractiveObject.ts:75
Array specifying dash pattern of an object’s borders (hasBorder must be true)
1.6.2
Inherited from
Section titled “Inherited from”borderOpacityWhenMoving
Section titled “borderOpacityWhenMoving”borderOpacityWhenMoving:
number
Defined in: src/shapes/Object/InteractiveObject.ts:76
Opacity of object’s controlling borders when object is active and moving
Default
Section titled “Default”0.4Inherited from
Section titled “Inherited from”FabricObject.borderOpacityWhenMoving
borderScaleFactor
Section titled “borderScaleFactor”borderScaleFactor:
number
Defined in: src/shapes/Object/InteractiveObject.ts:77
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”FabricObject.borderScaleFactor
centeredRotation
Section titled “centeredRotation”centeredRotation:
boolean
Defined in: src/shapes/Object/Object.ts:216
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”centeredScaling
Section titled “centeredScaling”centeredScaling:
boolean
Defined in: src/shapes/Object/Object.ts:217
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”clipPath?
Section titled “clipPath?”
optionalclipPath:BaseFabricObject<Partial<ObjectProps>,SerializedObjectProps,ObjectEvents>
Defined in: src/shapes/Object/Object.ts:213
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”clipPathId?
Section titled “clipPathId?”
optionalclipPathId:string
Defined in: src/shapes/Object/FabricObjectSVGExportMixin.ts:15
When an object is being exported as SVG as a clippath, a reference inside the SVG is needed. This reference is a UID in the fabric namespace and is temporary stored here.
Inherited from
Section titled “Inherited from”controls
Section titled “controls”controls:
TControlSet
Defined in: src/shapes/Object/InteractiveObject.ts:118
holds the controls for the object. controls are added by default_controls.js
Inherited from
Section titled “Inherited from”cornerColor
Section titled “cornerColor”cornerColor:
string
Defined in: src/shapes/Object/InteractiveObject.ts:68
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/InteractiveObject.ts:71
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”cornerSize
Section titled “cornerSize”cornerSize:
number
Defined in: src/shapes/Object/InteractiveObject.ts:65
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/InteractiveObject.ts:69
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”FabricObject.cornerStrokeColor
cornerStyle
Section titled “cornerStyle”cornerStyle:
"circle"|"rect"
Defined in: src/shapes/Object/InteractiveObject.ts:70
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”dirty:
boolean
Defined in: src/shapes/Object/Object.ts:242
When set to true, object’s cache will be rerendered next render call.
since 1.7.0
Default
Section titled “Default”trueInherited from
Section titled “Inherited from”evented
Section titled “evented”evented:
boolean
Defined in: src/shapes/Object/InteractiveObject.ts:82
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/Object.ts:209
When true, object is not exported in OBJECT/JSON
1.6.3
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObject.excludeFromExport
fill:
null|string|TFiller
Defined in: src/shapes/Object/Object.ts:192
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/Object.ts:193
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”flipX:
boolean
Defined in: src/shapes/Object/ObjectGeometry.ts:569
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/ObjectGeometry.ts:570
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/Object.ts:201
Composite rule used for canvas globalCompositeOperation
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObject.globalCompositeOperation
hasBorders
Section titled “hasBorders”hasBorders:
boolean
Defined in: src/shapes/Object/InteractiveObject.ts:78
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/InteractiveObject.ts:72
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/ObjectGeometry.ts:568
Object height
Default
Section titled “Default”Inherited from
Section titled “Inherited from”hoverCursor
Section titled “hoverCursor”hoverCursor:
null|string
Defined in: src/shapes/Object/InteractiveObject.ts:86
Default cursor value used when hovering over this object on canvas
Default
Section titled “Default”nullInherited from
Section titled “Inherited from”includeDefaultValues
Section titled “includeDefaultValues”includeDefaultValues:
boolean
Defined in: src/shapes/Object/Object.ts:208
When false, default object’s values are not included in its serialization
Default
Section titled “Default”Inherited from
Section titled “Inherited from”FabricObject.includeDefaultValues
inverted
Section titled “inverted”inverted:
boolean
Defined in: src/shapes/Object/Object.ts:214
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”isMoving?
Section titled “isMoving?”
optionalisMoving:boolean
Defined in: src/shapes/Object/InteractiveObject.ts:124
internal boolean to signal the code that the object is part of the move action.
Inherited from
Section titled “Inherited from”left:
number
Defined in: src/shapes/Object/ObjectGeometry.ts:566
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/InteractiveObject.ts:56
When true, object horizontal movement is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”lockMovementY
Section titled “lockMovementY”lockMovementY:
boolean
Defined in: src/shapes/Object/InteractiveObject.ts:57
When true, object vertical movement is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”lockRotation
Section titled “lockRotation”lockRotation:
boolean
Defined in: src/shapes/Object/InteractiveObject.ts:58
When true, object rotation is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”lockScalingFlip
Section titled “lockScalingFlip”lockScalingFlip:
boolean
Defined in: src/shapes/Object/InteractiveObject.ts:63
When true, object cannot be flipped by scaling into negative values
Default
Section titled “Default”Inherited from
Section titled “Inherited from”lockScalingX
Section titled “lockScalingX”lockScalingX:
boolean
Defined in: src/shapes/Object/InteractiveObject.ts:59
When true, object horizontal scaling is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”lockScalingY
Section titled “lockScalingY”lockScalingY:
boolean
Defined in: src/shapes/Object/InteractiveObject.ts:60
When true, object vertical scaling is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”lockSkewingX
Section titled “lockSkewingX”lockSkewingX:
boolean
Defined in: src/shapes/Object/InteractiveObject.ts:61
When true, object horizontal skewing is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”lockSkewingY
Section titled “lockSkewingY”lockSkewingY:
boolean
Defined in: src/shapes/Object/InteractiveObject.ts:62
When true, object vertical skewing is locked
Default
Section titled “Default”Inherited from
Section titled “Inherited from”matrixCache?
Section titled “matrixCache?”
optionalmatrixCache:TMatrixCache
Defined in: src/shapes/Object/ObjectGeometry.ts:73
storage cache for object full transform matrix
Inherited from
Section titled “Inherited from”minScaleLimit
Section titled “minScaleLimit”minScaleLimit:
number
Defined in: src/shapes/Object/Object.ts:187
Minimum allowed scale value of an object
Default
Section titled “Default”0Inherited from
Section titled “Inherited from”moveCursor
Section titled “moveCursor”moveCursor:
null|string
Defined in: src/shapes/Object/InteractiveObject.ts:87
Default cursor value used when moving this object on canvas
Default
Section titled “Default”nullInherited from
Section titled “Inherited from”noScaleCache
Section titled “noScaleCache”noScaleCache:
boolean
Defined in: src/shapes/Object/InteractiveObject.ts:51
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”objectCaching
Section titled “objectCaching”objectCaching:
boolean
Defined in: src/shapes/Object/Object.ts:211
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”oCoords
Section titled “oCoords”oCoords:
Record<string,TOCoord>
Defined in: src/shapes/Object/InteractiveObject.ts:95
The object’s controls’ position in viewport coordinates
Calculated by Control#positionHandler and Control#calcCornerCoords, depending on padding.
corner/touchCorner describe the 4 points forming the interactive area of the corner.
Used to draw and locate controls.
Inherited from
Section titled “Inherited from”opacity
Section titled “opacity”opacity:
number
Defined in: src/shapes/Object/Object.ts:189
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/ObjectGeometry.ts:578
Inherited from
Section titled “Inherited from”originY
Section titled “originY”originY:
TOriginY
Defined in: src/shapes/Object/ObjectGeometry.ts:582
Inherited from
Section titled “Inherited from”ownMatrixCache?
Section titled “ownMatrixCache?”
optionalownMatrixCache:TMatrixCache
Defined in: src/shapes/Object/ObjectGeometry.ts:68
storage cache for object transform matrix
Inherited from
Section titled “Inherited from”padding
Section titled “padding”padding:
number
Defined in: src/shapes/Object/ObjectGeometry.ts:53
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/Object.ts:191
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”parent?
Section titled “parent?”
optionalparent:Group
Defined in: src/shapes/Object/Object.ts:1606
A reference to the parent of the object
Used to keep the original parent ref when the object has been added to an ActiveSelection, hence loosing the group ref
Inherited from
Section titled “Inherited from”perPixelTargetFind
Section titled “perPixelTargetFind”perPixelTargetFind:
boolean
Defined in: src/shapes/Object/InteractiveObject.ts:83
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”FabricObject.perPixelTargetFind
scaleX
Section titled “scaleX”scaleX:
number
Defined in: src/shapes/Object/ObjectGeometry.ts:571
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/ObjectGeometry.ts:572
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/InteractiveObject.ts:81
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/InteractiveObject.ts:79
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”FabricObject.selectionBackgroundColor
shadow
Section titled “shadow”shadow:
null|Shadow
Defined in: src/shapes/Object/Object.ts:204
Shadow object representing shadow of this shape
Default
Section titled “Default”nullInherited from
Section titled “Inherited from”skewX:
number
Defined in: src/shapes/Object/ObjectGeometry.ts:573
Angle of skew on x axes of an object (in degrees)
Default
Section titled “Default”0Inherited from
Section titled “Inherited from”skewY:
number
Defined in: src/shapes/Object/ObjectGeometry.ts:574
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/InteractiveObject.ts:53
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/InteractiveObject.ts:54
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”stroke
Section titled “stroke”stroke:
null|string|TFiller
Defined in: src/shapes/Object/Object.ts:194
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/Object.ts:195
Array specifying dash pattern of an object’s stroke (stroke must be defined)
Default
Section titled “Default”null;Inherited from
Section titled “Inherited from”strokeDashOffset
Section titled “strokeDashOffset”strokeDashOffset:
number
Defined in: src/shapes/Object/Object.ts:196
Line offset of an object’s stroke
Default
Section titled “Default”0Inherited from
Section titled “Inherited from”strokeLineCap
Section titled “strokeLineCap”strokeLineCap:
CanvasLineCap
Defined in: src/shapes/Object/Object.ts:197
Line endings style of an object’s stroke (one of “butt”, “round”, “square”)
Default
Section titled “Default”buttInherited from
Section titled “Inherited from”strokeLineJoin
Section titled “strokeLineJoin”strokeLineJoin:
CanvasLineJoin
Defined in: src/shapes/Object/Object.ts:198
Corner style of an object’s stroke (one of “bevel”, “round”, “miter”)
Default
Section titled “Default”Inherited from
Section titled “Inherited from”strokeMiterLimit
Section titled “strokeMiterLimit”strokeMiterLimit:
number
Defined in: src/shapes/Object/Object.ts:199
Maximum miter length (used for strokeLineJoin = “miter”) of an object’s stroke
Default
Section titled “Default”4Inherited from
Section titled “Inherited from”strokeUniform
Section titled “strokeUniform”strokeUniform:
boolean
Defined in: src/shapes/Object/ObjectGeometry.ts:585
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”strokeWidth
Section titled “strokeWidth”strokeWidth:
number
Defined in: src/shapes/Object/ObjectGeometry.ts:584
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/ObjectGeometry.ts:565
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/InteractiveObject.ts:66
Size of object’s controlling corners when touch interaction is detected
Default
Section titled “Default”24Inherited from
Section titled “Inherited from”transparentCorners
Section titled “transparentCorners”transparentCorners:
boolean
Defined in: src/shapes/Object/InteractiveObject.ts:67
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”FabricObject.transparentCorners
visible
Section titled “visible”visible:
boolean
Defined in: src/shapes/Object/Object.ts:206
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/ObjectGeometry.ts:567
Object width
Default
Section titled “Default”Inherited from
Section titled “Inherited from”x1:
number
Defined in: src/shapes/Line.ts:42
x value or first line edge
Default
Section titled “Default”Implementation of
Section titled “Implementation of”UniqueLineProps.x1
x2:
number
Defined in: src/shapes/Line.ts:56
x value or second line edge
Default
Section titled “Default”Implementation of
Section titled “Implementation of”UniqueLineProps.x2
y1:
number
Defined in: src/shapes/Line.ts:49
y value or first line edge
Default
Section titled “Default”Implementation of
Section titled “Implementation of”UniqueLineProps.y1
y2:
number
Defined in: src/shapes/Line.ts:63
y value or second line edge
Default
Section titled “Default”Implementation of
Section titled “Implementation of”UniqueLineProps.y2
ATTRIBUTE_NAMES
Section titled “ATTRIBUTE_NAMES”
staticATTRIBUTE_NAMES:string[]
Defined in: src/shapes/Line.ts:238
List of attribute names to account for when parsing SVG element (used by Line.fromElement)
Static
Section titled “Static”Member Of
Section titled “Member Of”Line
http://www.w3.org/TR/SVG/shapes.html#LineElement
cacheProperties
Section titled “cacheProperties”
staticcacheProperties:string[]
Defined in: src/shapes/Line.ts:67
List of properties to consider when checking if cache needs refresh Those properties are checked by calls to Object.set(key, value). If the key is in this list, the object is marked as dirty and refreshed at the next render
Overrides
Section titled “Overrides”colorProperties
Section titled “colorProperties”
staticcolorProperties:string[]
Defined in: src/shapes/Object/Object.ts:1513
List of properties to consider for animating colors.
Inherited from
Section titled “Inherited from”customProperties
Section titled “customProperties”
staticcustomProperties:string[] =[]
Defined in: src/shapes/Object/Object.ts:1754
Define a list of custom properties that will be serialized when instance.toObject() gets called
Inherited from
Section titled “Inherited from”ownDefaults
Section titled “ownDefaults”
staticownDefaults:Partial<TClassProperties<InteractiveFabricObject<Partial<FabricObjectProps>,SerializedObjectProps,ObjectEvents>>> =interactiveObjectDefaultValues
Defined in: src/shapes/Object/InteractiveObject.ts:138
Inherited from
Section titled “Inherited from”stateProperties
Section titled “stateProperties”
staticstateProperties:string[]
Defined in: src/shapes/Object/Object.ts:225
This list of properties is used to check if the state of an object is changed. This state change now is only used for children of groups to understand if a group needs its cache regenerated during a .set call
Inherited from
Section titled “Inherited from”
statictype:string='Line'
Defined in: src/shapes/Line.ts:65
The class type. This is used for serialization and deserialization purposes and internally it can be used to identify classes. When we transform a class in a plain JS object we need a way to recognize which class it was, and the type is the way we do that. It has no other purposes and you should not give one. Hard to reach on instances and please do not use to drive instance’s logic (this.constructor.type). To idenfity a class use instanceof class ( instanceof Rect ). We do not do that in fabricJS code because we want to try to have code splitting possible.
Overrides
Section titled “Overrides”Accessors
Section titled “Accessors”Get Signature
Section titled “Get Signature”get type():
string
Defined in: src/shapes/Object/Object.ts:354
Legacy identifier of the class. Prefer using utils like isType or instanceOf Will be removed in fabric 7 or 8. The setter exists to avoid type errors in old code and possibly current deserialization code. DO NOT build new code around this type value
add sustainable warning message
Returns
Section titled “Returns”string
Set Signature
Section titled “Set Signature”set type(
value):void
Defined in: src/shapes/Object/Object.ts:362
Parameters
Section titled “Parameters”string
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”Methods
Section titled “Methods”_drawClipPath()
Section titled “_drawClipPath()”_drawClipPath(
ctx,clipPath,context):void
Defined in: src/shapes/Object/Object.ts:884
Prepare clipPath state and cache and draw it on instance’s cache
Parameters
Section titled “Parameters”CanvasRenderingContext2D
clipPath
Section titled “clipPath”undefined | BaseFabricObject<Partial<ObjectProps>, SerializedObjectProps, ObjectEvents>
context
Section titled “context”Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”_limitCacheSize()
Section titled “_limitCacheSize()”_limitCacheSize(
dims):any
Defined in: src/shapes/Object/Object.ts:403
Limit the cache dimensions so that X * Y do not cross config.perfLimitSizeTotal and each side do not cross fabric.cacheSideLimit those numbers are configurable so that you can get as much detail as you want making bargain with performances.
Parameters
Section titled “Parameters”any
Returns
Section titled “Returns”any
.width width of canvas
Inherited from
Section titled “Inherited from”_removeCacheCanvas()
Section titled “_removeCacheCanvas()”_removeCacheCanvas():
void
Defined in: src/shapes/Object/Object.ts:720
Remove cacheCanvas and its dimensions from the objects
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”FabricObject._removeCacheCanvas
_renderControls()
Section titled “_renderControls()”_renderControls(
ctx,styleOverride?):void
Defined in: src/shapes/Object/InteractiveObject.ts:435
Renders controls and borders for the object the context here is not transformed
Parameters
Section titled “Parameters”CanvasRenderingContext2D
Context to render on
styleOverride?
Section titled “styleOverride?”TStyleOverride = {}
properties to override the object style
Returns
Section titled “Returns”void
move to interactivity
Inherited from
Section titled “Inherited from”_setClippingProperties()
Section titled “_setClippingProperties()”_setClippingProperties(
ctx):void
Defined in: src/shapes/Object/Object.ts:1029
Parameters
Section titled “Parameters”CanvasRenderingContext2D
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”FabricObject._setClippingProperties
_setFillStyles()
Section titled “_setFillStyles()”_setFillStyles(
ctx,__namedParameters):void
Defined in: src/shapes/Object/Object.ts:1018
Parameters
Section titled “Parameters”CanvasRenderingContext2D
__namedParameters
Section titled “__namedParameters”Pick<Line<Props, SProps, EventSpec>, "fill">
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”_setStrokeStyles()
Section titled “_setStrokeStyles()”_setStrokeStyles(
ctx,decl):void
Defined in: src/shapes/Object/Object.ts:976
Parameters
Section titled “Parameters”CanvasRenderingContext2D
Pick<Line<Props, SProps, EventSpec>, "stroke" | "strokeWidth" | "strokeDashOffset" | "strokeLineCap" | "strokeLineJoin" | "strokeMiterLimit">
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”_setupCompositeOperation()
Section titled “_setupCompositeOperation()”_setupCompositeOperation(
ctx):void
Defined in: src/shapes/Object/Object.ts:1488
Sets canvas globalCompositeOperation for specific object custom composition operation for the particular object can be specified using globalCompositeOperation property
Parameters
Section titled “Parameters”CanvasRenderingContext2D
Rendering canvas context
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”FabricObject._setupCompositeOperation
_toSVG()
Section titled “_toSVG()”_toSVG():
string[]
Defined in: src/shapes/Line.ts:223
Returns svg representation of an instance
Returns
Section titled “Returns”string[]
an array of strings with the specific svg representation of the instance
Overrides
Section titled “Overrides”addPaintOrder()
Section titled “addPaintOrder()”addPaintOrder(
this):string
Defined in: src/shapes/Object/FabricObjectSVGExportMixin.ts:250
Parameters
Section titled “Parameters”FabricObjectSVGExportMixin & FabricObject<Partial<FabricObjectProps>, SerializedObjectProps, ObjectEvents>
Returns
Section titled “Returns”string
Inherited from
Section titled “Inherited from”animate()
Section titled “animate()”animate<
T>(animatable,options?):Record<string,TAnimation<T>>
Defined in: src/shapes/Object/Object.ts:1527
Animates object’s properties
Type Parameters
Section titled “Type Parameters”T extends number | number[] | TColorArg
Parameters
Section titled “Parameters”animatable
Section titled “animatable”Record<string, T>
map of keys and end values
options?
Section titled “options?”Partial<AnimationOptions<T>>
Returns
Section titled “Returns”Record<string, TAnimation<T>>
map of animation contexts
As object — multiple properties
object.animate({ left: …, top: … }); object.animate({ left: …, top: … }, { duration: … });
Tutorial
Section titled “Tutorial”http://fabricjs.com/fabric-intro-part-2#animation
Inherited from
Section titled “Inherited from”calcACoords()
Section titled “calcACoords()”calcACoords():
TCornerPoint
Defined in: src/shapes/Object/ObjectGeometry.ts:429
Calculates the coordinates of the 4 corner of the bbox, in absolute coordinates. those never change with zoom or viewport changes.
Returns
Section titled “Returns”Inherited from
Section titled “Inherited from”calcOCoords()
Section titled “calcOCoords()”calcOCoords():
Record<string,TOCoord>
Defined in: src/shapes/Object/InteractiveObject.ts:255
Calculates the coordinates of the center of each control plus the corners of the control itself This basically just delegates to each control positionHandler WARNING: changing what is passed to positionHandler is a breaking change, since position handler is a public api and should be done just if extremely necessary
Returns
Section titled “Returns”Record<string, TOCoord>
Inherited from
Section titled “Inherited from”calcOwnMatrix()
Section titled “calcOwnMatrix()”calcOwnMatrix():
TMat2D
Defined in: src/shapes/Object/ObjectGeometry.ts:515
calculate transform matrix that represents the current transformations from the object’s properties, this matrix does not include the group transformation
Returns
Section titled “Returns”transform matrix for the object
Inherited from
Section titled “Inherited from”calcTransformMatrix()
Section titled “calcTransformMatrix()”calcTransformMatrix(
skipGroup?):TMat2D
Defined in: src/shapes/Object/ObjectGeometry.ts:487
calculate transform matrix that represents the current transformations from the object’s properties.
Parameters
Section titled “Parameters”skipGroup?
Section titled “skipGroup?”boolean = false
return transform matrix for object not counting parent transformations There are some situation in which this is useful to avoid the fake rotation.
Returns
Section titled “Returns”transform matrix for the object
Inherited from
Section titled “Inherited from”FabricObject.calcTransformMatrix
canDrop()
Section titled “canDrop()”canDrop(
_e):boolean
Defined in: src/shapes/Object/InteractiveObject.ts:701
Override to customize drag and drop behavior
Parameters
Section titled “Parameters”DragEvent
Returns
Section titled “Returns”boolean
true if the object currently dragged can be dropped on the target
Inherited from
Section titled “Inherited from”clearContextTop()
Section titled “clearContextTop()”clearContextTop(
restoreManually?):undefined|CanvasRenderingContext2D
Defined in: src/shapes/Object/InteractiveObject.ts:627
Clears the canvas.contextTop in a specific area that corresponds to the object’s bounding box that is in the canvas.contextContainer. This function is used to clear pieces of contextTop where we render ephemeral effects on top of the object. Example: blinking cursor text selection, drag effects.
Parameters
Section titled “Parameters”restoreManually?
Section titled “restoreManually?”boolean
When true won’t restore the context after clear, in order to draw something else.
Returns
Section titled “Returns”undefined | CanvasRenderingContext2D
canvas.contextTop that is either still transformed with the object transformMatrix, or restored to neutral transform
discuss swapping restoreManually with a renderCallback, but think of async issues
Inherited from
Section titled “Inherited from”clone()
Section titled “clone()”clone(
propertiesToInclude?):Promise<Line<Props,SProps,EventSpec>>
Defined in: src/shapes/Object/Object.ts:1255
Clones an instance.
Parameters
Section titled “Parameters”propertiesToInclude?
Section titled “propertiesToInclude?”string[]
Any properties that you might want to additionally include in the output
Returns
Section titled “Returns”Promise<Line<Props, SProps, EventSpec>>
Inherited from
Section titled “Inherited from”cloneAsImage()
Section titled “cloneAsImage()”cloneAsImage(
options?):FabricImage
Defined in: src/shapes/Object/Object.ts:1281
Creates an instance of Image out of an object makes use of toCanvasElement. Once this method was based on toDataUrl and loadImage, so it also had a quality and format option. toCanvasElement is faster and produce no loss of quality. If you need to get a real Jpeg or Png from an object, using toDataURL is the right way to do it. toCanvasElement and then toBlob from the obtained canvas is also a good option.
Parameters
Section titled “Parameters”options?
Section titled “options?”ObjectToCanvasElementOptions
for clone as image, passed to toDataURL
Returns
Section titled “Returns”Object cloned as image.
fix the export type, it could not be Image but the type that getClass return for ‘image’.
Inherited from
Section titled “Inherited from”complexity()
Section titled “complexity()”complexity():
number
Defined in: src/shapes/Object/Object.ts:1430
Returns complexity of an instance
Returns
Section titled “Returns”number
complexity of this instance (is 1 unless subclassed)
Inherited from
Section titled “Inherited from”containsPoint()
Section titled “containsPoint()”containsPoint(
point):boolean
Defined in: src/shapes/Object/ObjectGeometry.ts:284
Checks if point is inside the object
Parameters
Section titled “Parameters”Point to check against
Returns
Section titled “Returns”boolean
true if point is inside the object
Inherited from
Section titled “Inherited from”dispose()
Section titled “dispose()”dispose():
void
Defined in: src/shapes/Object/Object.ts:1498
cancel instance’s running animations
override if necessary to dispose artifacts such as clipPath
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”drawBorders()
Section titled “drawBorders()”drawBorders(
ctx,options,styleOverride?):void
Defined in: src/shapes/Object/InteractiveObject.ts:478
Draws borders of an object’s bounding box. Requires public properties: width, height Requires public options: padding, borderColor
Parameters
Section titled “Parameters”CanvasRenderingContext2D
Context to draw on
options
Section titled “options”Required
object representing current object parameters
styleOverride?
Section titled “styleOverride?”TStyleOverride
object to override the object style
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”drawCacheOnCanvas()
Section titled “drawCacheOnCanvas()”drawCacheOnCanvas(
this,ctx):void
Defined in: src/shapes/Object/Object.ts:906
Paint the cached copy of the object on the target context.
Parameters
Section titled “Parameters”TCachedFabricObject
CanvasRenderingContext2D
Context to render on
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”FabricObject.drawCacheOnCanvas
drawClipPathOnCache()
Section titled “drawClipPathOnCache()”drawClipPathOnCache(
ctx,clipPath,canvasWithClipPath):void
Defined in: src/shapes/Object/Object.ts:812
Execute the drawing operation for an object clipPath
Parameters
Section titled “Parameters”CanvasRenderingContext2D
Context to render on
clipPath
Section titled “clipPath”canvasWithClipPath
Section titled “canvasWithClipPath”HTMLCanvasElement
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”FabricObject.drawClipPathOnCache
drawControls()
Section titled “drawControls()”drawControls(
ctx,styleOverride):void
Defined in: src/shapes/Object/InteractiveObject.ts:550
Draws corners of an object’s bounding box. Requires public properties: width, height Requires public options: cornerSize, padding Be aware that since fabric 6.0 this function does not call setCoords anymore. setCoords needs to be called manually if the object of which we are rendering controls is outside the standard selection and transform process.
Parameters
Section titled “Parameters”CanvasRenderingContext2D
Context to draw on
styleOverride
Section titled “styleOverride”Partial = {}
object to override the object style
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”drawControlsConnectingLines()
Section titled “drawControlsConnectingLines()”drawControlsConnectingLines(
ctx,size):void
Defined in: src/shapes/Object/InteractiveObject.ts:517
Draws lines from a borders of an object’s bounding box to controls that have withConnection property set.
Requires public properties: width, height
Requires public options: padding, borderColor
Parameters
Section titled “Parameters”CanvasRenderingContext2D
Context to draw on
object size x = width, y = height
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”FabricObject.drawControlsConnectingLines
drawObject()
Section titled “drawObject()”drawObject(
ctx,forClipping,context):void
Defined in: src/shapes/Object/Object.ts:836
Execute the drawing operation for an object on a specified context
Parameters
Section titled “Parameters”CanvasRenderingContext2D
Context to render on
forClipping
Section titled “forClipping”apply clipping styles
undefined | boolean
context
Section titled “context”additional context for rendering
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”drawSelectionBackground()
Section titled “drawSelectionBackground()”drawSelectionBackground(
ctx):void
Defined in: src/shapes/Object/InteractiveObject.ts:375
Draws a colored layer behind the object, inside its selection borders. Requires public options: padding, selectionBackgroundColor this function is called when the context is transformed has checks to be skipped when the object is on a staticCanvas
Parameters
Section titled “Parameters”CanvasRenderingContext2D
Context to draw on
Returns
Section titled “Returns”void
evaluate if make this disappear in favor of a pre-render hook for objects this was added by Andrea Bogazzi to make possible some feature for work reasons it seemed a good option, now is an edge case
Inherited from
Section titled “Inherited from”FabricObject.drawSelectionBackground
findCommonAncestors()
Section titled “findCommonAncestors()”findCommonAncestors<
T>(other):AncestryComparison
Defined in: src/shapes/Object/Object.ts:1645
Compare ancestors
Type Parameters
Section titled “Type Parameters”T extends Line<Props, SProps, EventSpec>
Parameters
Section titled “Parameters”T
Returns
Section titled “Returns”AncestryComparison
an object that represent the ancestry situation.
Inherited from
Section titled “Inherited from”FabricObject.findCommonAncestors
fire()
Section titled “fire()”fire<
K>(eventName,options?):void
Defined in: src/Observable.ts:167
Fires event with an optional options object
Type Parameters
Section titled “Type Parameters”K extends string | number | symbol
Parameters
Section titled “Parameters”eventName
Section titled “eventName”K
Event name to fire
options?
Section titled “options?”EventSpec[K]
Options object
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”forEachControl()
Section titled “forEachControl()”forEachControl(
fn):void
Defined in: src/shapes/Object/InteractiveObject.ts:353
Calls a function for each control. The function gets called, with the control, the control’s key and the object that is calling the iterator
Parameters
Section titled “Parameters”(control, key, fabricObject) => any
function to iterate over the controls over
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”get(
property):any
Defined in: src/CommonMethods.ts:59
Basic getter
Parameters
Section titled “Parameters”property
Section titled “property”string
Property name
Returns
Section titled “Returns”any
value of a property
Inherited from
Section titled “Inherited from”getActiveControl()
Section titled “getActiveControl()”getActiveControl():
undefined| {control:Control;coord:TOCoord;key:string; }
Defined in: src/shapes/Object/InteractiveObject.ts:194
Returns
Section titled “Returns”undefined | { control: Control; coord: TOCoord; key: string; }
Inherited from
Section titled “Inherited from”getAncestors()
Section titled “getAncestors()”getAncestors():
Ancestors
Defined in: src/shapes/Object/Object.ts:1628
Returns
Section titled “Returns”Ancestors
ancestors (excluding ActiveSelection) from bottom to top
Inherited from
Section titled “Inherited from”getBoundingRect()
Section titled “getBoundingRect()”getBoundingRect():
TBBox
Defined in: src/shapes/Object/ObjectGeometry.ts:345
Returns coordinates of object’s bounding rectangle (left, top, width, height) the box is intended as aligned to axis of canvas.
Returns
Section titled “Returns”Object with left, top, width, height properties
Inherited from
Section titled “Inherited from”getCanvasRetinaScaling()
Section titled “getCanvasRetinaScaling()”getCanvasRetinaScaling():
number
Defined in: src/shapes/Object/ObjectGeometry.ts:402
Returns
Section titled “Returns”number
Inherited from
Section titled “Inherited from”FabricObject.getCanvasRetinaScaling
getCenterPoint()
Section titled “getCenterPoint()”getCenterPoint():
Point
Defined in: src/shapes/Object/ObjectGeometry.ts:735
Returns the center coordinates of the object relative to canvas
Returns
Section titled “Returns”Inherited from
Section titled “Inherited from”getCoords()
Section titled “getCoords()”getCoords():
Point[]
Defined in: src/shapes/Object/ObjectGeometry.ts:204
Returns
Section titled “Returns”Point[]
[tl, tr, br, bl] in the scene plane
Inherited from
Section titled “Inherited from”getObjectOpacity()
Section titled “getObjectOpacity()”getObjectOpacity():
number
Defined in: src/shapes/Object/Object.ts:571
Return the object opacity counting also the group property
Returns
Section titled “Returns”number
Inherited from
Section titled “Inherited from”getObjectScaling()
Section titled “getObjectScaling()”getObjectScaling():
Point
Defined in: src/shapes/Object/Object.ts:540
Return the object scale factor counting also the group scaling
Returns
Section titled “Returns”Inherited from
Section titled “Inherited from”getPointByOrigin()
Section titled “getPointByOrigin()”getPointByOrigin(
originX,originY):Point
Defined in: src/shapes/Object/ObjectGeometry.ts:765
Returns the position of the object as if it has a different origin. Take an object that has left, top set to 100, 100 with origin ‘left’, ‘top’. Return the values of left top ( wrapped in a point ) that you would need to keep the same position if origin where different. Alternatively you can use this to also find which point in the parent plane is a specific origin ( where is the bottom right corner of my object? )
Parameters
Section titled “Parameters”originX
Section titled “originX”Horizontal origin: ‘left’, ‘center’ or ‘right’
originY
Section titled “originY”Vertical origin: ‘top’, ‘center’ or ‘bottom’
Returns
Section titled “Returns”Inherited from
Section titled “Inherited from”getRelativeCenterPoint()
Section titled “getRelativeCenterPoint()”getRelativeCenterPoint():
Point
Defined in: src/shapes/Object/ObjectGeometry.ts:746
Returns the center coordinates of the object relative to it’s parent
Returns
Section titled “Returns”Inherited from
Section titled “Inherited from”FabricObject.getRelativeCenterPoint
getRelativeX()
Section titled “getRelativeX()”getRelativeX():
number
Defined in: src/shapes/Object/ObjectGeometry.ts:115
Returns
Section titled “Returns”number
x position according to object’s FabricObject#originX property in parent’s coordinate plane
if parent is canvas then this property is identical to getX
Inherited from
Section titled “Inherited from”getRelativeXY()
Section titled “getRelativeXY()”getRelativeXY():
Point
Defined in: src/shapes/Object/ObjectGeometry.ts:176
Returns
Section titled “Returns”x,y position according to object’s FabricObject#originX FabricObject#originY properties in parent’s coordinate plane
Inherited from
Section titled “Inherited from”getRelativeY()
Section titled “getRelativeY()”getRelativeY():
number
Defined in: src/shapes/Object/ObjectGeometry.ts:131
Returns
Section titled “Returns”number
y position according to object’s FabricObject#originY property in parent’s coordinate plane
if parent is canvas then this property is identical to getY
Inherited from
Section titled “Inherited from”getScaledHeight()
Section titled “getScaledHeight()”getScaledHeight():
number
Defined in: src/shapes/Object/ObjectGeometry.ts:363
Returns height of an object bounding box counting transformations
Returns
Section titled “Returns”number
height value
shouldn’t this account for group transform and return the actual size in canvas coordinate plane?
Inherited from
Section titled “Inherited from”getScaledWidth()
Section titled “getScaledWidth()”getScaledWidth():
number
Defined in: src/shapes/Object/ObjectGeometry.ts:354
Returns width of an object’s bounding box counting transformations
Returns
Section titled “Returns”number
width value
shouldn’t this account for group transform and return the actual size in canvas coordinate plane?
Inherited from
Section titled “Inherited from”getSvgCommons()
Section titled “getSvgCommons()”getSvgCommons(
this):string
Defined in: src/shapes/Object/FabricObjectSVGExportMixin.ts:85
Returns id attribute for svg output
Parameters
Section titled “Parameters”FabricObjectSVGExportMixin & FabricObject<Partial<FabricObjectProps>, SerializedObjectProps, ObjectEvents> & object
Returns
Section titled “Returns”string
Inherited from
Section titled “Inherited from”getSvgFilter()
Section titled “getSvgFilter()”getSvgFilter(
this):string
Defined in: src/shapes/Object/FabricObjectSVGExportMixin.ts:77
Returns filter for svg shadow
Parameters
Section titled “Parameters”FabricObjectSVGExportMixin & FabricObject<Partial<FabricObjectProps>, SerializedObjectProps, ObjectEvents>
Returns
Section titled “Returns”string
Inherited from
Section titled “Inherited from”getSvgStyles()
Section titled “getSvgStyles()”getSvgStyles(
this,skipShadow?):string
Defined in: src/shapes/Object/FabricObjectSVGExportMixin.ts:22
Returns styles-string for svg-export
Parameters
Section titled “Parameters”FabricObjectSVGExportMixin & FabricObject<Partial<FabricObjectProps>, SerializedObjectProps, ObjectEvents>
skipShadow?
Section titled “skipShadow?”boolean
a boolean to skip shadow filter output
Returns
Section titled “Returns”string
Inherited from
Section titled “Inherited from”getSvgTransform()
Section titled “getSvgTransform()”getSvgTransform(
this,full?,additionalTransform?):string
Defined in: src/shapes/Object/FabricObjectSVGExportMixin.ts:104
Returns transform-string for svg-export
Parameters
Section titled “Parameters”FabricObjectSVGExportMixin & FabricObject<Partial<FabricObjectProps>, SerializedObjectProps, ObjectEvents>
boolean
additionalTransform?
Section titled “additionalTransform?”string = ''
Returns
Section titled “Returns”string
Inherited from
Section titled “Inherited from”getTotalAngle()
Section titled “getTotalAngle()”getTotalAngle():
TDegree
Defined in: src/shapes/Object/ObjectGeometry.ts:410
Returns the object angle relative to canvas counting also the group property
Returns
Section titled “Returns”Inherited from
Section titled “Inherited from”getTotalObjectScaling()
Section titled “getTotalObjectScaling()”getTotalObjectScaling():
Point
Defined in: src/shapes/Object/Object.ts:557
Return the object scale factor counting also the group scaling, zoom and retina
Returns
Section titled “Returns”object with scaleX and scaleY properties
Inherited from
Section titled “Inherited from”FabricObject.getTotalObjectScaling
getViewportTransform()
Section titled “getViewportTransform()”getViewportTransform():
TMat2D
Defined in: src/shapes/Object/ObjectGeometry.ts:420
Retrieves viewportTransform from Object’s canvas if available
Returns
Section titled “Returns”Inherited from
Section titled “Inherited from”FabricObject.getViewportTransform
getX()
Section titled “getX()”getX():
number
Defined in: src/shapes/Object/ObjectGeometry.ts:86
Returns
Section titled “Returns”number
x position according to object’s FabricObject#originX property in canvas coordinate plane
Inherited from
Section titled “Inherited from”getXY()
Section titled “getXY()”getXY():
Point
Defined in: src/shapes/Object/ObjectGeometry.ts:146
Returns
Section titled “Returns”x position according to object’s FabricObject#originX FabricObject#originY properties in canvas coordinate plane
Inherited from
Section titled “Inherited from”getY()
Section titled “getY()”getY():
number
Defined in: src/shapes/Object/ObjectGeometry.ts:100
Returns
Section titled “Returns”number
y position according to object’s FabricObject#originY property in canvas coordinate plane
Inherited from
Section titled “Inherited from”hasCommonAncestors()
Section titled “hasCommonAncestors()”hasCommonAncestors<
T>(other):boolean
Defined in: src/shapes/Object/Object.ts:1710
Type Parameters
Section titled “Type Parameters”T extends Line<Props, SProps, EventSpec>
Parameters
Section titled “Parameters”T
Returns
Section titled “Returns”boolean
Inherited from
Section titled “Inherited from”FabricObject.hasCommonAncestors
hasFill()
Section titled “hasFill()”hasFill():
null|boolean|""
Defined in: src/shapes/Object/Object.ts:751
return true if the object will draw a fill Does not consider text styles. This is just a shortcut used at rendering time We want it to be an approximation and be fast. wrote to avoid extra caching, it has to return true when fill happens, can guess when it will not happen at 100% chance, does not matter if it misses some use case where the fill is invisible.
Returns
Section titled “Returns”null | boolean | ""
Boolean
3.0.0
Inherited from
Section titled “Inherited from”hasStroke()
Section titled “hasStroke()”hasStroke():
null|boolean|""
Defined in: src/shapes/Object/Object.ts:735
return true if the object will draw a stroke Does not consider text styles. This is just a shortcut used at rendering time We want it to be an approximation and be fast. wrote to avoid extra caching, it has to return true when stroke happens, can guess when it will not happen at 100% chance, does not matter if it misses some use case where the stroke is invisible.
Returns
Section titled “Returns”null | boolean | ""
Boolean
3.0.0
Inherited from
Section titled “Inherited from”intersectsWithObject()
Section titled “intersectsWithObject()”intersectsWithObject(
other):boolean
Defined in: src/shapes/Object/ObjectGeometry.ts:234
Checks if object intersects with another object
Parameters
Section titled “Parameters”ObjectGeometry
Object to test
Returns
Section titled “Returns”boolean
true if object intersects with another object
Inherited from
Section titled “Inherited from”FabricObject.intersectsWithObject
intersectsWithRect()
Section titled “intersectsWithRect()”intersectsWithRect(
tl,br):boolean
Defined in: src/shapes/Object/ObjectGeometry.ts:220
Checks if object intersects with the scene rect formed by TL and BR In this case the rect is meant aligned with the axis of the canvas. TL is the TOP LEFT point while br is the BOTTOM RIGHT point
Parameters
Section titled “Parameters”Returns
Section titled “Returns”boolean
Inherited from
Section titled “Inherited from”FabricObject.intersectsWithRect
isCacheDirty()
Section titled “isCacheDirty()”isCacheDirty(
skipCanvas):boolean
Defined in: src/shapes/Object/Object.ts:923
Check if cache is dirty and if is dirty clear the context. This check has a big side effect, it changes the underlying cache canvas if necessary. Do not call this method on your own to check if the cache is dirty, because if it is, it is also going to wipe the cache. This is badly designed and needs to be fixed.
Parameters
Section titled “Parameters”skipCanvas
Section titled “skipCanvas”boolean = false
skip canvas checks because this object is painted on parent canvas.
Returns
Section titled “Returns”boolean
Inherited from
Section titled “Inherited from”isContainedWithinObject()
Section titled “isContainedWithinObject()”isContainedWithinObject(
other):boolean
Defined in: src/shapes/Object/ObjectGeometry.ts:253
Checks if object is fully contained within area of another object
Parameters
Section titled “Parameters”ObjectGeometry
Object to test
Returns
Section titled “Returns”boolean
true if object is fully contained within area of another object
Inherited from
Section titled “Inherited from”FabricObject.isContainedWithinObject
isContainedWithinRect()
Section titled “isContainedWithinRect()”isContainedWithinRect(
tl,br):boolean
Defined in: src/shapes/Object/ObjectGeometry.ts:261
Checks if object is fully contained within the scene rect formed by TL and BR
Parameters
Section titled “Parameters”Returns
Section titled “Returns”boolean
Inherited from
Section titled “Inherited from”FabricObject.isContainedWithinRect
isControlVisible()
Section titled “isControlVisible()”isControlVisible(
controlKey):boolean
Defined in: src/shapes/Object/InteractiveObject.ts:584
Returns true if the specified control is visible, false otherwise.
Parameters
Section titled “Parameters”controlKey
Section titled “controlKey”string
The key of the control. Possible values are usually ‘tl’, ‘tr’, ‘br’, ‘bl’, ‘ml’, ‘mt’, ‘mr’, ‘mb’, ‘mtr’, but since the control api allow for any control name, can be any string.
Returns
Section titled “Returns”boolean
true if the specified control is visible, false otherwise
Inherited from
Section titled “Inherited from”isDescendantOf()
Section titled “isDescendantOf()”isDescendantOf(
target):boolean
Defined in: src/shapes/Object/Object.ts:1614
Checks if object is descendant of target Should be used instead of Group.contains or StaticCanvas.contains for performance reasons
Parameters
Section titled “Parameters”target
Section titled “target”TAncestor
Returns
Section titled “Returns”boolean
Inherited from
Section titled “Inherited from”isInFrontOf()
Section titled “isInFrontOf()”isInFrontOf<
T>(other):undefined|boolean
Defined in: src/shapes/Object/Object.ts:1720
Type Parameters
Section titled “Type Parameters”T extends Line<Props, SProps, EventSpec>
Parameters
Section titled “Parameters”T
object to compare against
Returns
Section titled “Returns”undefined | boolean
if objects do not share a common ancestor or they are strictly equal it is impossible to determine which is in front of the other; in such cases the function returns undefined
Inherited from
Section titled “Inherited from”isNotVisible()
Section titled “isNotVisible()”isNotVisible():
boolean
Defined in: src/shapes/Object/Object.ts:650
Returns
Section titled “Returns”boolean
Inherited from
Section titled “Inherited from”isOnScreen()
Section titled “isOnScreen()”isOnScreen():
boolean
Defined in: src/shapes/Object/ObjectGeometry.ts:293
Checks if object is contained within the canvas with current viewportTransform the check is done stopping at first point that appears on screen
Returns
Section titled “Returns”boolean
true if object is fully or partially contained within canvas
Inherited from
Section titled “Inherited from”isOverlapping()
Section titled “isOverlapping()”isOverlapping<
T>(other):boolean
Defined in: src/shapes/Object/ObjectGeometry.ts:271
Type Parameters
Section titled “Type Parameters”T extends ObjectGeometry<ObjectEvents>
Parameters
Section titled “Parameters”T
Returns
Section titled “Returns”boolean
Inherited from
Section titled “Inherited from”isPartiallyOnScreen()
Section titled “isPartiallyOnScreen()”isPartiallyOnScreen():
boolean
Defined in: src/shapes/Object/ObjectGeometry.ts:323
Checks if object is partially contained within the canvas with current viewportTransform
Returns
Section titled “Returns”boolean
true if object is partially contained within canvas
Inherited from
Section titled “Inherited from”FabricObject.isPartiallyOnScreen
isType()
Section titled “isType()”isType(…
types):boolean
Defined in: src/shapes/Object/Object.ts:1419
Returns true if any of the specified types is identical to the type of an instance
Parameters
Section titled “Parameters”…string[]
Returns
Section titled “Returns”boolean
Inherited from
Section titled “Inherited from”needsItsOwnCache()
Section titled “needsItsOwnCache()”needsItsOwnCache():
boolean
Defined in: src/shapes/Object/Object.ts:763
When returns true, force the object to have its own cache, even if it is inside a group
it may be needed when your object behave in a particular way on the cache and always needs
its own isolated canvas to render correctly.
Created to be overridden
since 1.7.12
Returns
Section titled “Returns”boolean
Boolean
Inherited from
Section titled “Inherited from”Call Signature
Section titled “Call Signature”off<
K>(eventName):void
Defined in: src/Observable.ts:122
Unsubscribe all event listeners for eventname. Do not use this pattern. You could kill internal fabricJS events. We know we should have protected events for internal flows, but we don’t have yet
Type Parameters
Section titled “Type Parameters”K extends string | number | symbol
Parameters
Section titled “Parameters”eventName
Section titled “eventName”K
event name (eg. ‘after:render’)
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”Call Signature
Section titled “Call Signature”off<
K>(eventName,handler):void
Defined in: src/Observable.ts:128
unsubscribe an event listener
Type Parameters
Section titled “Type Parameters”K extends string | number | symbol
Parameters
Section titled “Parameters”eventName
Section titled “eventName”K
event name (eg. ‘after:render’)
handler
Section titled “handler”TEventCallback
event listener to unsubscribe
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”Call Signature
Section titled “Call Signature”off(
handlers):void
Defined in: src/Observable.ts:133
unsubscribe event listeners
Parameters
Section titled “Parameters”handlers
Section titled “handlers”EventRegistryObject<EventSpec>
handlers key/value pairs (eg. {‘after:render’: handler, ‘selection:cleared’: handler})
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”Call Signature
Section titled “Call Signature”off():
void
Defined in: src/Observable.ts:137
unsubscribe all event listeners
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”Call Signature
Section titled “Call Signature”on<
K,E>(eventName,handler):VoidFunction
Defined in: src/Observable.ts:23
Observes specified event
Type Parameters
Section titled “Type Parameters”K extends string | number | symbol
E
Parameters
Section titled “Parameters”eventName
Section titled “eventName”K
Event name (eg. ‘after:render’)
handler
Section titled “handler”TEventCallback<E>
Function that receives a notification when an event of the specified type occurs
Returns
Section titled “Returns”VoidFunction
disposer
on
Inherited from
Section titled “Inherited from”Call Signature
Section titled “Call Signature”on(
handlers):VoidFunction
Defined in: src/Observable.ts:27
Observes specified event
Parameters
Section titled “Parameters”handlers
Section titled “handlers”EventRegistryObject<EventSpec>
key/value pairs (eg. {‘after:render’: handler, ‘selection:cleared’: handler})
Returns
Section titled “Returns”VoidFunction
disposer
on
Inherited from
Section titled “Inherited from”once()
Section titled “once()”Call Signature
Section titled “Call Signature”once<
K,E>(eventName,handler):VoidFunction
Defined in: src/Observable.ts:62
Observes specified event once
Type Parameters
Section titled “Type Parameters”K extends string | number | symbol
E
Parameters
Section titled “Parameters”eventName
Section titled “eventName”K
Event name (eg. ‘after:render’)
handler
Section titled “handler”TEventCallback<E>
Function that receives a notification when an event of the specified type occurs
Returns
Section titled “Returns”VoidFunction
disposer
once
Inherited from
Section titled “Inherited from”Call Signature
Section titled “Call Signature”once(
handlers):VoidFunction
Defined in: src/Observable.ts:66
Observes specified event once
Parameters
Section titled “Parameters”handlers
Section titled “handlers”EventRegistryObject<EventSpec>
key/value pairs (eg. {‘after:render’: handler, ‘selection:cleared’: handler})
Returns
Section titled “Returns”VoidFunction
disposer
once
Inherited from
Section titled “Inherited from”onDeselect()
Section titled “onDeselect()”onDeselect(
_options?):boolean
Defined in: src/shapes/Object/InteractiveObject.ts:658
This callback function is called every time _discardActiveObject or _setActiveObject try to to deselect this object. If the function returns true, the process is cancelled
Parameters
Section titled “Parameters”_options?
Section titled “_options?”options sent from the upper functions
object?
Section titled “object?”InteractiveFabricObject<Partial<FabricObjectProps>, SerializedObjectProps, ObjectEvents>
Returns
Section titled “Returns”boolean
Inherited from
Section titled “Inherited from”onDragStart()
Section titled “onDragStart()”onDragStart(
_e):boolean
Defined in: src/shapes/Object/InteractiveObject.ts:691
Override to customize Drag behavior
Fired once a drag session has started
Parameters
Section titled “Parameters”DragEvent
Returns
Section titled “Returns”boolean
true to handle the drag event
Inherited from
Section titled “Inherited from”onSelect()
Section titled “onSelect()”onSelect(
_options?):boolean
Defined in: src/shapes/Object/InteractiveObject.ts:672
This callback function is called every time _discardActiveObject or _setActiveObject try to to select this object. If the function returns true, the process is cancelled
Parameters
Section titled “Parameters”_options?
Section titled “_options?”options sent from the upper functions
event if the process is generated by an event
Returns
Section titled “Returns”boolean
Inherited from
Section titled “Inherited from”render()
Section titled “render()”render(
ctx):void
Defined in: src/shapes/Object/Object.ts:662
Renders an object on a specified context
Parameters
Section titled “Parameters”CanvasRenderingContext2D
Context to render on
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”renderCache()
Section titled “renderCache()”renderCache(
this,options?):void
Defined in: src/shapes/Object/Object.ts:696
Parameters
Section titled “Parameters”TCachedFabricObject
options?
Section titled “options?”any
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”renderDragSourceEffect()
Section titled “renderDragSourceEffect()”renderDragSourceEffect(
_e):void
Defined in: src/shapes/Object/InteractiveObject.ts:712
Override to customize drag and drop behavior render a specific effect when an object is the source of a drag event example: render the selection status for the part of text that is being dragged from a text object
Parameters
Section titled “Parameters”DragEvent
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”FabricObject.renderDragSourceEffect
renderDropTargetEffect()
Section titled “renderDropTargetEffect()”renderDropTargetEffect(
_e):void
Defined in: src/shapes/Object/InteractiveObject.ts:724
Override to customize drag and drop behavior render a specific effect when an object is the target of a drag event used to show that the underly object can receive a drop, or to show how the object will change when dropping. example: show the cursor where the text is about to be dropped
Parameters
Section titled “Parameters”DragEvent
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”FabricObject.renderDropTargetEffect
rotate()
Section titled “rotate()”rotate(
angle):void
Defined in: src/shapes/Object/Object.ts:1447
Sets “angle” of an instance with centered rotation
Parameters
Section titled “Parameters”Angle value (in degrees)
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”scale()
Section titled “scale()”scale(
value):void
Defined in: src/shapes/Object/ObjectGeometry.ts:372
Scales an object (equally by x and y)
Parameters
Section titled “Parameters”number
Scale factor
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”scaleToHeight()
Section titled “scaleToHeight()”scaleToHeight(
value):void
Defined in: src/shapes/Object/ObjectGeometry.ts:395
Scales an object to a given height, with respect to bounding box (scaling by x/y equally)
Parameters
Section titled “Parameters”number
New height value
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”scaleToWidth()
Section titled “scaleToWidth()”scaleToWidth(
value):void
Defined in: src/shapes/Object/ObjectGeometry.ts:383
Scales an object to a given width, with respect to bounding box (scaling by x/y equally)
Parameters
Section titled “Parameters”number
New width value
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”set(
key,value?):Line<Props,SProps,EventSpec>
Defined in: src/CommonMethods.ts:29
Sets property to a given value. When changing position/dimension -related properties (left, top, scale, angle, etc.) set does not update position of object’s borders/controls. If you need to update those, call setCoords().
Parameters
Section titled “Parameters”Property name or object (if object, iterate over the object properties)
string | Record<string, any>
value?
Section titled “value?”any
Property value (if function, the value is passed into it and its return value is used as a new one)
Returns
Section titled “Returns”Line<Props, SProps, EventSpec>
Inherited from
Section titled “Inherited from”setControlsVisibility()
Section titled “setControlsVisibility()”setControlsVisibility(
options?):void
Defined in: src/shapes/Object/InteractiveObject.ts:611
Sets the visibility state of object controls, this is just a bulk option for setControlVisible;
Parameters
Section titled “Parameters”options?
Section titled “options?”Record<string, boolean> = {}
with an optional key per control example: {Boolean} [options.bl] true to enable the bottom-left control, false to disable it
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”FabricObject.setControlsVisibility
setControlVisible()
Section titled “setControlVisible()”setControlVisible(
controlKey,visible):void
Defined in: src/shapes/Object/InteractiveObject.ts:599
Sets the visibility of the specified control. please do not use.
Parameters
Section titled “Parameters”controlKey
Section titled “controlKey”string
The key of the control. Possible values are ‘tl’, ‘tr’, ‘br’, ‘bl’, ‘ml’, ‘mt’, ‘mr’, ‘mb’, ‘mtr’. but since the control api allow for any control name, can be any string.
visible
Section titled “visible”boolean
true to set the specified control visible, false otherwise
Returns
Section titled “Returns”void
discuss this overlap of priority here with the team. Andrea Bogazzi for details
Inherited from
Section titled “Inherited from”FabricObject.setControlVisible
setCoords()
Section titled “setCoords()”setCoords():
void
Defined in: src/shapes/Object/InteractiveObject.ts:343
set controls’ coordinates as well See https://github.com/fabricjs/fabric.js/wiki/When-to-call-setCoords and http://fabricjs.com/fabric-gotchas
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”setOnGroup()
Section titled “setOnGroup()”setOnGroup():
void
Defined in: src/shapes/Object/Object.ts:1479
This callback function is called by the parent group of an object every time a non-delegated property changes on the group. It is passed the key and value as parameters. Not adding in this function’s signature to avoid Travis build error about unused variables.
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”setPositionByOrigin()
Section titled “setPositionByOrigin()”setPositionByOrigin(
pos,originX,originY):void
Defined in: src/shapes/Object/ObjectGeometry.ts:780
Sets the position of the object taking into consideration the object’s origin
Parameters
Section titled “Parameters”The new position of the object
originX
Section titled “originX”Horizontal origin: ‘left’, ‘center’ or ‘right’
originY
Section titled “originY”Vertical origin: ‘top’, ‘center’ or ‘bottom’
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”FabricObject.setPositionByOrigin
setRelativeX()
Section titled “setRelativeX()”setRelativeX(
value):void
Defined in: src/shapes/Object/ObjectGeometry.ts:123
Parameters
Section titled “Parameters”number
x position according to object’s FabricObject#originX property in parent’s coordinate plane
if parent is canvas then this method is identical to setX
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”setRelativeXY()
Section titled “setRelativeXY()”setRelativeXY(
point,originX?,originY?):void
Defined in: src/shapes/Object/ObjectGeometry.ts:186
As setXY, but in current parent’s coordinate plane (the current group if any or the canvas)
Parameters
Section titled “Parameters”position according to object’s FabricObject#originX FabricObject#originY properties in parent’s coordinate plane
originX?
Section titled “originX?”TOriginX = ...
Horizontal origin: ‘left’, ‘center’ or ‘right’
originY?
Section titled “originY?”TOriginY = ...
Vertical origin: ‘top’, ‘center’ or ‘bottom’
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”setRelativeY()
Section titled “setRelativeY()”setRelativeY(
value):void
Defined in: src/shapes/Object/ObjectGeometry.ts:139
Parameters
Section titled “Parameters”number
y position according to object’s FabricObject#originY property in parent’s coordinate plane
if parent is canvas then this property is identical to setY
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”setX()
Section titled “setX()”setX(
value):void
Defined in: src/shapes/Object/ObjectGeometry.ts:93
Parameters
Section titled “Parameters”number
x position according to object’s FabricObject#originX property in canvas coordinate plane
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”setXY()
Section titled “setXY()”setXY(
point,originX?,originY?):void
Defined in: src/shapes/Object/ObjectGeometry.ts:163
Set an object position to a particular point, the point is intended in absolute ( canvas ) coordinate. You can specify FabricObject#originX and FabricObject#originY values, that otherwise are the object’s current values.
Parameters
Section titled “Parameters”position in scene coordinate plane
originX?
Section titled “originX?”Horizontal origin: ‘left’, ‘center’ or ‘right’
originY?
Section titled “originY?”Vertical origin: ‘top’, ‘center’ or ‘bottom’
Returns
Section titled “Returns”void
Example
Section titled “Example”object.setXY(new Point(5, 5), 'left', 'bottom').Inherited from
Section titled “Inherited from”setY()
Section titled “setY()”setY(
value):void
Defined in: src/shapes/Object/ObjectGeometry.ts:107
Parameters
Section titled “Parameters”number
y position according to object’s FabricObject#originY property in canvas coordinate plane
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”shouldCache()
Section titled “shouldCache()”shouldCache():
boolean
Defined in: src/shapes/Object/Object.ts:788
Decide if the object should cache or not. Create its own cache level objectCaching is a global flag, wins over everything needsItsOwnCache should be used when the object drawing method requires a cache step. Generally you do not cache objects in groups because the group outside is cached. Read as: cache if is needed, or if the feature is enabled but we are not already caching.
Returns
Section titled “Returns”boolean
Inherited from
Section titled “Inherited from”shouldStartDragging()
Section titled “shouldStartDragging()”shouldStartDragging(
_e):boolean
Defined in: src/shapes/Object/InteractiveObject.ts:682
Override to customize Drag behavior Fired from Canvas#_onMouseMove
Parameters
Section titled “Parameters”Returns
Section titled “Returns”boolean
true in order for the window to start a drag session
Inherited from
Section titled “Inherited from”FabricObject.shouldStartDragging
strokeBorders()
Section titled “strokeBorders()”strokeBorders(
ctx,size):void
Defined in: src/shapes/Object/InteractiveObject.ts:399
override this function in order to customize the drawing of the control box, e.g. rounded corners, different border style.
Parameters
Section titled “Parameters”CanvasRenderingContext2D
ctx is rotated and translated so that (0,0) is at object’s center
the control box size used
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”toBlob()
Section titled “toBlob()”toBlob(
options):Promise<null|Blob>
Defined in: src/shapes/Object/Object.ts:1406
Parameters
Section titled “Parameters”options
Section titled “options”toDataURLOptions = {}
Returns
Section titled “Returns”Promise<null | Blob>
Inherited from
Section titled “Inherited from”toCanvasElement()
Section titled “toCanvasElement()”toCanvasElement(
options):HTMLCanvasElement
Defined in: src/shapes/Object/Object.ts:1303
Converts an object into a HTMLCanvas element
Parameters
Section titled “Parameters”options
Section titled “options”ObjectToCanvasElementOptions = {}
Options object
Returns
Section titled “Returns”HTMLCanvasElement
Returns DOM element
Inherited from
Section titled “Inherited from”toClipPathSVG()
Section titled “toClipPathSVG()”toClipPathSVG(
this,reviver?):string
Defined in: src/shapes/Object/FabricObjectSVGExportMixin.ts:144
Returns svg clipPath representation of an instance
Parameters
Section titled “Parameters”FabricObjectSVGExportMixin & FabricObject<Partial<FabricObjectProps>, SerializedObjectProps, ObjectEvents>
reviver?
Section titled “reviver?”Method for further parsing of svg representation.
Returns
Section titled “Returns”string
svg representation of an instance
Inherited from
Section titled “Inherited from”toDatalessObject()
Section titled “toDatalessObject()”toDatalessObject(
propertiesToInclude?):any
Defined in: src/shapes/Object/Object.ts:1854
Returns (dataless) object representation of an instance
Parameters
Section titled “Parameters”propertiesToInclude?
Section titled “propertiesToInclude?”any[]
Any properties that you might want to additionally include in the output
Returns
Section titled “Returns”any
Object representation of an instance
Inherited from
Section titled “Inherited from”toDataURL()
Section titled “toDataURL()”toDataURL(
options):string
Defined in: src/shapes/Object/Object.ts:1399
Converts an object into a data-url-like string
Parameters
Section titled “Parameters”options
Section titled “options”toDataURLOptions = {}
Options object
Returns
Section titled “Returns”string
Returns a data: URL containing a representation of the object in the format specified by options.format
Inherited from
Section titled “Inherited from”toggle()
Section titled “toggle()”toggle(
property):Line<Props,SProps,EventSpec>
Defined in: src/CommonMethods.ts:46
Toggles specified property from true to false or from false to true
Parameters
Section titled “Parameters”property
Section titled “property”string
Property to toggle
Returns
Section titled “Returns”Line<Props, SProps, EventSpec>
Inherited from
Section titled “Inherited from”toJSON()
Section titled “toJSON()”toJSON():
any
Defined in: src/shapes/Object/Object.ts:1438
Returns a JSON representation of an instance
Returns
Section titled “Returns”any
JSON
Inherited from
Section titled “Inherited from”toObject()
Section titled “toObject()”toObject<
T,K>(propertiesToInclude?):Pick<T,K> &SProps
Defined in: src/shapes/Line.ts:165
Returns object representation of an instance
Type Parameters
Section titled “Type Parameters”T extends Omit<Props & TClassProperties<Line<Props, SProps, EventSpec>>, keyof SProps>
K extends string | number | symbol = never
Parameters
Section titled “Parameters”propertiesToInclude?
Section titled “propertiesToInclude?”K[] = []
Any properties that you might want to additionally include in the output
Returns
Section titled “Returns”Pick<T, K> & SProps
object representation of an instance
Method
Section titled “Method”toObject
Overrides
Section titled “Overrides”toString()
Section titled “toString()”toString():
string
Defined in: src/shapes/Object/Object.ts:1894
Returns a string representation of an instance
Returns
Section titled “Returns”string
Inherited from
Section titled “Inherited from”toSVG()
Section titled “toSVG()”toSVG(
this,reviver?):string
Defined in: src/shapes/Object/FabricObjectSVGExportMixin.ts:130
Returns svg representation of an instance
Parameters
Section titled “Parameters”FabricObjectSVGExportMixin & FabricObject<Partial<FabricObjectProps>, SerializedObjectProps, ObjectEvents>
reviver?
Section titled “reviver?”Method for further parsing of svg representation.
Returns
Section titled “Returns”string
svg representation of an instance
Inherited from
Section titled “Inherited from”transform()
Section titled “transform()”transform(
ctx):void
Defined in: src/shapes/Object/Object.ts:528
Transforms context when rendering an object
Parameters
Section titled “Parameters”CanvasRenderingContext2D
Context
Returns
Section titled “Returns”void
Inherited from
Section titled “Inherited from”transformMatrixKey()
Section titled “transformMatrixKey()”transformMatrixKey(
skipGroup):number[]
Defined in: src/shapes/Object/ObjectGeometry.ts:455
Parameters
Section titled “Parameters”skipGroup
Section titled “skipGroup”boolean = false
Returns
Section titled “Returns”number[]
Inherited from
Section titled “Inherited from”FabricObject.transformMatrixKey
translateToCenterPoint()
Section titled “translateToCenterPoint()”translateToCenterPoint(
point,originX,originY):Point
Defined in: src/shapes/Object/ObjectGeometry.ts:685
Translates the coordinates from origin to center coordinates (based on the object’s dimensions)
Parameters
Section titled “Parameters”The point which corresponds to the originX and originY params
originX
Section titled “originX”Horizontal origin: ‘left’, ‘center’ or ‘right’
originY
Section titled “originY”Vertical origin: ‘top’, ‘center’ or ‘bottom’
Returns
Section titled “Returns”Inherited from
Section titled “Inherited from”FabricObject.translateToCenterPoint
translateToGivenOrigin()
Section titled “translateToGivenOrigin()”translateToGivenOrigin(
point,fromOriginX,fromOriginY,toOriginX,toOriginY):Point
Defined in: src/shapes/Object/ObjectGeometry.ts:657
Translates the coordinates from a set of origin to another (based on the object’s dimensions)
Parameters
Section titled “Parameters”The point which corresponds to the originX and originY params
fromOriginX
Section titled “fromOriginX”Horizontal origin: ‘left’, ‘center’ or ‘right’
fromOriginY
Section titled “fromOriginY”Vertical origin: ‘top’, ‘center’ or ‘bottom’
toOriginX
Section titled “toOriginX”Horizontal origin: ‘left’, ‘center’ or ‘right’
toOriginY
Section titled “toOriginY”Vertical origin: ‘top’, ‘center’ or ‘bottom’
Returns
Section titled “Returns”Inherited from
Section titled “Inherited from”FabricObject.translateToGivenOrigin
translateToOriginPoint()
Section titled “translateToOriginPoint()”translateToOriginPoint(
center,originX,originY):Point
Defined in: src/shapes/Object/ObjectGeometry.ts:713
Translates the coordinates from center to origin coordinates (based on the object’s dimensions)
Parameters
Section titled “Parameters”center
Section titled “center”The point which corresponds to center of the object
originX
Section titled “originX”Horizontal origin: ‘left’, ‘center’ or ‘right’
originY
Section titled “originY”Vertical origin: ‘top’, ‘center’ or ‘bottom’
Returns
Section titled “Returns”Inherited from
Section titled “Inherited from”FabricObject.translateToOriginPoint
willDrawShadow()
Section titled “willDrawShadow()”willDrawShadow():
boolean
Defined in: src/shapes/Object/Object.ts:801
Check if this object will cast a shadow with an offset. used by Group.shouldCache to know if child has a shadow recursively
Returns
Section titled “Returns”boolean
Inherited from
Section titled “Inherited from”_fromObject()
Section titled “_fromObject()”
static_fromObject<S>(__namedParameters,__namedParameters):Promise<S>
Defined in: src/shapes/Object/Object.ts:1907
Type Parameters
Section titled “Type Parameters”S extends BaseFabricObject<Partial<ObjectProps>, SerializedObjectProps, ObjectEvents>
Parameters
Section titled “Parameters”__namedParameters
Section titled “__namedParameters”Record<string, unknown>
__namedParameters
Section titled “__namedParameters”Abortable & object = {}
Returns
Section titled “Returns”Promise<S>
Inherited from
Section titled “Inherited from”createControls()
Section titled “createControls()”
staticcreateControls():object
Defined in: src/shapes/Object/InteractiveObject.ts:167
Creates the default control object. If you prefer to have on instance of controls shared among all objects make this function return an empty object and add controls to the ownDefaults
Returns
Section titled “Returns”object
controls
Section titled “controls”controls:
Record<string,Control>
Inherited from
Section titled “Inherited from”fromElement()
Section titled “fromElement()”
staticfromElement(element,options?,cssRules?):Promise<Line<{ },SerializedLineProps,ObjectEvents>>
Defined in: src/shapes/Line.ts:248
Returns Line instance from an SVG element
Parameters
Section titled “Parameters”element
Section titled “element”HTMLElement
Element to parse
options?
Section titled “options?”Options object
cssRules?
Section titled “cssRules?”CSSRules
Returns
Section titled “Returns”Promise<Line<{ }, SerializedLineProps, ObjectEvents>>
Static
Section titled “Static”Member Of
Section titled “Member Of”Line
fromObject()
Section titled “fromObject()”
staticfromObject<T>(object):Promise<Line<Partial<FabricObjectProps>,SerializedLineProps,ObjectEvents>>
Defined in: src/shapes/Line.ts:272
Returns Line instance from an object representation
Type Parameters
Section titled “Type Parameters”T extends TOptions<SerializedLineProps>
Parameters
Section titled “Parameters”object
Section titled “object”T
Object to create an instance from
Returns
Section titled “Returns”Promise<Line<Partial<FabricObjectProps>, SerializedLineProps, ObjectEvents>>
Static
Section titled “Static”Member Of
Section titled “Member Of”Line
Overrides
Section titled “Overrides”getDefaults()
Section titled “getDefaults()”
staticgetDefaults():Record<string,any>
Defined in: src/shapes/Object/InteractiveObject.ts:140
Returns
Section titled “Returns”Record<string, any>