Namespace: fabric

fabric

Source:

Classes

ActiveSelection
BaseBrush
Canvas
Circle
CircleBrush
Color
Ellipse
Gradient
Group
Image
Intersection
IText
Line
Object
Path
Pattern
PatternBrush
PencilBrush
Point
Polygon
Polyline
Rect
Shadow
SprayBrush
StaticCanvas
Text
Textbox
Triangle

Namespaces

Collection
CommonMethods
Observable
util

Members

(static) arcToSegmentsCache

This object contains the result of arc to bezier conversion for faster retrieving if the same arc needs to be converted again. It was an internal variable, is accessible since version 2.3.4
Source:

(static) boundsOfCurveCache

This object keeps the results of the boundsOfCurve calculation mapped by the joined arguments necessary to calculate it. It does speed up calculation, if you parse and add always the same paths, but in case of heavy usage of freedrawing you do not get any speed benefit and you get a big object in memory. The object was a private variable before, while now is appended to the lib so that you have access to it and you can eventually clear it. It was an internal variable, is accessible since version 2.3.4
Source:

(static) browserShadowBlurConstant :Number

Browser-specific constant to adjust CanvasRenderingContext2D.shadowBlur value, which is unitless and not rendered equally across browsers. Values that work quite well (as of October 2017) are: - Chrome: 1.5 - Edge: 1.75 - Firefox: 0.9 - Safari: 0.95
Type:
  • Number
Since:
  • 2.0.0
Default Value:
  • 1
Source:

(static) cachesBoundsOfCurve

If disabled boundsOfCurveCache is not used. For apps that make heavy usage of pencil drawing probably disabling it is better
Default Value:
  • true
Source:

(static) charWidthsCache

Cache Object for widths of chars in text rendering.
Source:

(static) devicePixelRatio

Device Pixel Ratio
Source:
See:

(static) disableStyleCopyPaste :Boolean

When 'true', style information is not retained when copy/pasting text, making pasted text use destination style. Defaults to 'false'.
Type:
  • Boolean
Source:

(static) DPI

Pixel per Inch as a default value set to 96. Can be changed for more realistic conversion.
Source:

(static) enableGLFiltering :Boolean

Enable webgl for filtering picture is available A filtering backend will be initialized, this will both take memory and time since a default 2048x2048 canvas will be created for the gl context
Type:
  • Boolean
Since:
  • 2.0.0
Default Value:
  • true
Source:

(static) forceGLPutImageData :Boolean

Skip performance testing of setupGLContext and force the use of putImageData that seems to be the one that works best on Chrome + old hardware. if your users are experiencing empty images after filtering you may try to force this to true this has to be set before instantiating the filtering backend ( before filtering the first image )
Type:
  • Boolean
Default Value:
  • false
Source:

(static) isLikelyNode :boolean

True when in environment that's probably Node.js
Type:
  • boolean
Source:

(static) isTouchSupported :boolean

True when in environment that supports touch events
Type:
  • boolean
Source:

(static) log

Wrapper around `console.log` (when available)
Source:

(static) maxCacheSideLimit :Number

Pixel limit for cache canvases width or height. IE fixes the maximum at 5000
Type:
  • Number
Since:
  • 1.7.14
Default Value:
  • 4096
Source:

(static) minCacheSideLimit :Number

Lowest pixel limit for cache canvases, set at 256PX
Type:
  • Number
Since:
  • 1.7.14
Default Value:
  • 256
Source:

(static) perfLimitSizeTotal :Number

Pixel limit for cache canvases. 1Mpx , 4Mpx should be fine.
Type:
  • Number
Since:
  • 1.7.14
Default Value:
  • 2097152
Source:

(static) RUNNING_ANIMATIONS :Array.<AnimationContext>

Array holding all running animations
Type:
  • Array.<AnimationContext>
Source:

(static) SHARED_ATTRIBUTES :array

Attributes parsed from all SVG elements
Type:
  • array
Source:

(static) textureSize :Number

if webgl is enabled and available, textureSize will determine the size of the canvas backend
Type:
  • Number
Since:
  • 2.0.0
Default Value:
  • 2048
Source:

(static) warn

Wrapper around `console.warn` (when available)
Source:

Methods

(static) getCSSRules(doc) → {Object}

Returns CSS rules for a given SVG document
Parameters:
Name Type Description
doc SVGDocument SVG document to parse
Source:
Returns:
CSS rules of this document
Type
Object

(static) getGradientDefs(doc) → {Object}

Parses an SVG document, returning all of the gradient declarations found in it
Parameters:
Name Type Description
doc SVGDocument SVG document to parse
Source:
Returns:
Gradient definitions; key corresponds to element id, value -- to gradient definition element
Type
Object

(static) isWebglSupported(tileSize) → {Boolean}

Indicate whether this filtering backend is supported by the user's browser.
Parameters:
Name Type Description
tileSize Number check if the tileSize is supported
Source:
Returns:
Whether the user's browser supports WebGL.
Type
Boolean

(static) loadSVGFromString(string, callback, reviveropt, optionsopt)

Takes string corresponding to an SVG document, and parses it into a set of fabric objects
Parameters:
Name Type Attributes Description
string String
callback function
reviver function <optional>
Method for further parsing of SVG elements, called after each fabric object created.
options Object <optional>
Object containing options for parsing
Properties
Name Type Attributes Description
crossOrigin String <optional>
crossOrigin crossOrigin setting to use for external resources
Source:

(static) loadSVGFromURL(url, callback, reviveropt, optionsopt)

Takes url corresponding to an SVG document, and parses it into a set of fabric objects. Note that SVG is fetched via XMLHttpRequest, so it needs to conform to SOP (Same Origin Policy)
Parameters:
Name Type Attributes Description
url String
callback function
reviver function <optional>
Method for further parsing of SVG elements, called after each fabric object created.
options Object <optional>
Object containing options for parsing
Properties
Name Type Attributes Description
crossOrigin String <optional>
crossOrigin crossOrigin setting to use for external resources
Source:

(static) parseAttributes(element, attributes) → {Object}

Returns an object of attributes' name/value, given element and an array of attribute names; Parses parent "g" nodes recursively upwards.
Parameters:
Name Type Description
element DOMElement Element to parse
attributes Array Array of attributes to parse
Source:
Returns:
object containing parsed attributes' names/values
Type
Object

(static) parseElements(elements, callback, optionsopt, reviveropt)

Transforms an array of svg elements to corresponding fabric.* instances
Parameters:
Name Type Attributes Description
elements Array Array of elements to parse
callback function Being passed an array of fabric instances (transformed from SVG elements)
options Object <optional>
Options object
reviver function <optional>
Method for further parsing of SVG elements, called after each fabric object created.
Source:

(static) parseFontDeclaration(value, oStyle)

Parses a short font declaration, building adding its properties to a style object
Parameters:
Name Type Description
value String font declaration
oStyle Object definition
Source:

(static) parsePointsAttribute(points) → {Array}

Parses "points" attribute, returning an array of values
Parameters:
Name Type Description
points String points attribute string
Source:
Returns:
array of points
Type
Array

(static) parseStyleAttribute(element) → {Object}

Parses "style" attribute, retuning an object with values
Parameters:
Name Type Description
element SVGElement Element to parse
Source:
Returns:
Objects with values parsed from style attribute of an element
Type
Object

(static) parseSVGDocument(doc, callback, reviveropt, parsingOptionsopt)

Parses an SVG document, converts it to an array of corresponding fabric.* instances and passes them to a callback
Parameters:
Name Type Attributes Description
doc SVGDocument SVG document to parse
callback function Callback to call when parsing is finished; It's being passed an array of elements (parsed from a document).
reviver function <optional>
Method for further parsing of SVG elements, called after each fabric object created.
parsingOptions Object <optional>
options for parsing document
Properties
Name Type Attributes Description
crossOrigin String <optional>
crossOrigin settings
Source:

(static) parseTransformAttribute(attributeValue) → {Array}

Parses "transform" attribute, returning an array of values
Parameters:
Name Type Description
attributeValue String String containing attribute value
Source:
Returns:
Array of 6 elements representing transformation matrix
Type
Array