fabric.js中文API-自学php网

Source:

fabric.js, line 632

Namespaces

array
ease
object
string

Members

(static) getElementStyle

Returns style attribute value of a given element 返回给定元素的样式属性值

Source:

fabric.js, line 3385

(static) setImageSmoothing

setImageSmoothing sets the context imageSmoothingEnabled property. Used by canvas and by ImageObject. setImageSmoothing设置上下文imageSmoothingEnabled属性。由canvas和ImageObject使用。

Since:

4.0.0

Source:

fabric.js, line 3490

Methods

(static) addClass(element, className)

Adds class to an element 向元素添加类

Parameters:

Name	Type	Description
`element`	HTMLElement	Element to add class to元素，向其中添加类
`className`	String	Class to add to an element类添加到元素

Source:

fabric.js, line 3271

(static) addListener(element, eventName, handler)

Adds an event listener to an element 向元素添加事件侦听器

Parameters:

Name	Type	Description
`element`	HTMLElement
`eventName`	String
`handler`	function

Source:

fabric.js, line 3090

(static) addTransformToObject(object, transform)

given an object and a transform, apply the transform to the object. this is equivalent to change the space where the object is drawn. Adding to an object a transform that scale by 2 is like scaling it by 2. This is used when removing an object from an active selection for example. 给定一个对象和一个变换，将变换应用于该对象。这相当于改变绘制对象的空间。给一个对象添加一个缩放2的变换就像把它缩放2。例如，在从活动选择中删除对象时使用。

Parameters:

Name	Type	Description
`object`	fabric.Object	the object you want to transform要变换的对象
`transform`	Array	the destination transform目标变换

Source:

fabric.js, line 1730

(static) animate(optionsopt) → {CancelFunction}

Changes value from one to another within certain period of time, invoking callbacks as value is being changed. 在一定时间内将值从一个更改为另一个，并在值更改时调用回调。

Parameters:

Name	Type	Attributes	Description
`options`	AnimationOptions	<optional>	Animation options动画选项

Source:

fabric.js, line 3699

Returns:

cancel function

Type: CancelFunction

(static) animateColor(fromColor, toColor, durationopt, optionsopt) → {function}

Changes the color from one to another within certain period of time, invoking callbacks as value is being changed. 在一定时间内将颜色从一种更改为另一种，当值发生变化时调用回调。

Parameters:

Name Type Attributes Description

fromColor String The starting color in hex or rgb(a) format.十六进制或rgb(a)格式的起始颜色。

toColor String The starting color in hex or rgb(a) format.十六进制或rgb(a)格式的起始颜色。

duration Number <optional> Duration of change (in ms).变化持续时间(以毫秒为单位)。

options

Object

Animation options

Properties

Name	Type	Attributes	Description
`onChange`	function	<optional>	Callback; invoked on every value change回调;在每次值更改时调用
`onComplete`	function	<optional>	Callback; invoked when value change is completed回调;在完成值更改时调用
`colorEasing`	function	<optional>	Easing function. Note that this function only take two arguments (currentTime, duration). Thus the regular animation easing functions cannot be used.宽松的功能。注意，这个函数只有两个参数(currentTime, duration)。因此不能使用常规的动画缓动功能。
`abort`	function	<optional>	Additional function with logic. If returns true, onComplete is called.附加功能与逻辑。如果返回true，则调用onComplete。

动画选项属性名字类型属性描述 onChange 函数回调;在每次值更改时调用 onComplete 函数回调;在完成值更改时调用 colorEasing 函数宽松的功能。注意，这个函数只有两个参数(currentTime, duration)。因此不能使用常规的动画缓动功能。中止函数附加功能与逻辑。如果返回true，则调用onComplete。

Source:

fabric.js, line 3832

Returns:

abort function

Type: function

(static) applyTransformToObject(object, transform)

discard an object transform state and apply the one from the matrix. 放弃对象转换状态并应用矩阵中的转换状态。

Parameters:

Name	Type	Description
`object`	fabric.Object	the object you want to transform要变换的对象
`transform`	Array	the destination transform目标变换

Source:

fabric.js, line 1743

(static) calcAngleBetweenVectors(a, b)

Calculates angle between 2 vectors using dot product 使用点积计算两个向量之间的夹角

Parameters:

Name	Type	Description
`a`	Point
`b`	Point

Source:

fabric.js, line 790

Returns:

the angle in radian between the vectors

(static) calcDimensionsMatrix(options) → {Array.<Number>}

Returns a transform matrix starting from an object of the same kind of the one returned from qrDecompose, useful also if you want to calculate some transformations from an object that is not enlived yet. is called DimensionsTransformMatrix because those properties are the one that influence the size of the resulting box of the object. 返回从相同类型的对象开始的变换矩阵从qr分解返回的一个，如果你想计算一些也很有用从尚未激活的对象进行转换。叫做dimensionstrtransformmatrix因为这些属性会影响对象的结果框的大小。

Parameters:

Name Type Description

options

Object

Properties

Name	Type	Attributes
`scaleX`	Number	<optional>
`scaleY`	Number	<optional>
`flipX`	Boolean	<optional>
`flipY`	Boolean	<optional>
`skewX`	Number	<optional>
`skewY`	Number	<optional>

属性名字类型属性描述 scaleX 数量写入scaleY 数量 flipX 布尔 flipY 布尔 skewX 数量 skewY 数量

Source:

fabric.js, line 1446

Returns:

transform matrix

Type: Array.<Number>

(static) calcRotateMatrix(options) → {Array.<Number>}

Parameters:

Name Type Description

options

Object

Properties

Name	Type	Attributes	Description
`angle`	Number	<optional>	angle in degrees度数角

属性名字类型属性描述角数量度数角

Source:

fabric.js, line 1419

Returns:

transform matrix

Type: Array.<Number>

(static) clearFabricFontCache(fontFamilyopt)

Clear char widths cache for the given font family or all the cache if no fontFamily is specified. Use it if you know you are loading fonts in a lazy way and you are not waiting for custom fonts to load properly when adding text objects to the canvas. If a text object is added when its own font is not loaded yet, you will get wrong measurement and so wrong bounding boxes. After the font cache is cleared, either change the textObject text content or call initDimensions() to trigger a recalculation 清除给定字体族的字符宽度缓存，如果没有，则清除所有缓存指定fontFamily。如果你知道你正在以一种懒惰的方式加载字体，并且你没有等待，那么使用它用于在向画布添加文本对象时正确加载自定义字体。如果一个文本对象在它自己的字体还没有加载的时候被添加，你就会出错测量和错误的边界框。清除字体缓存后，更改textObject文本内容或调用 initDimensions()触发重新计算

Parameters:

Name	Type	Attributes	Description
`fontFamily`	String	<optional>	font family to clear要清除的字体族

Source:

fabric.js, line 1627

(static) composeMatrix(options) → {Array.<Number>}

Parameters:

Name Type Description

options

Object

Properties

Name	Type	Attributes
`angle`	Number	<optional>
`scaleX`	Number	<optional>
`scaleY`	Number	<optional>
`flipX`	Boolean	<optional>
`flipY`	Boolean	<optional>
`skewX`	Number	<optional>
`skewX`	Number	<optional>
`translateX`	Number	<optional>
`translateY`	Number	<optional>

属性名字类型属性描述角数量 scaleX 数量写入scaleY 数量 flipX 布尔 flipY 布尔 skewX 数量 skewX 数量 translateX 数量 translateY 数量

Source:

fabric.js, line 1491

Returns:

transform matrix

Type: Array.<Number>

(static) copyCanvasElement(canvas) → {CanvasElement}

Creates a canvas element that is a copy of another and is also painted 创建一个画布元素，该元素是另一个元素的副本，并且也被绘制

Parameters:

Name	Type	Description
`canvas`	CanvasElement	to copy size and content of复制…的大小和内容

Source:

fabric.js, line 1333

Returns:

initialized canvas element

Type: CanvasElement

(static) cos(angle) → {Number}

Calculate the cos of an angle, avoiding returning floats for known results 计算角度的余弦值，避免返回已知结果的浮点数

Parameters:

Name	Type	Description
`angle`	Number	the angle in radians or in degree角:以弧度或角度表示的角

Source:

fabric.js, line 644

Returns:

Type: Number

(static) createCanvasElement() → {CanvasElement}

Creates canvas element 创建画布元素

Source:

fabric.js, line 1322

Returns:

initialized canvas element

Type: CanvasElement

(static) createClass(parentopt, propertiesopt)

Helper for creation of "classes". 帮助创建“类”。

Parameters:

Name	Type	Attributes	Description
`parent`	function	<optional>	optional "Class" to inherit from要继承的可选“类”
`properties`	Object	<optional>	Properties shared by all instances of this class (be careful modifying objects defined here as this would affect all instances)由该类的所有实例共享的属性 (修改此处定义的对象时要小心，因为这会影响所有实例)

Source:

fabric.js, line 3044

(static) createImage() → {HTMLImageElement}

Creates image element (works on client and node) 创建图像元素(适用于客户端和节点)

Source:

fabric.js, line 1360

Returns:

HTML image element

Type: HTMLImageElement

(static) degreesToRadians(degrees) → {Number}

Transforms degrees to radians. 将角度转换为弧度。

Parameters:

Name	Type	Description
`degrees`	Number	value in degrees度值

Source:

fabric.js, line 716

Returns:

value in radians

Type: Number

(static) enlivenObjectEnlivables(object, contextopt)

Creates corresponding fabric instances residing in an object, e.g. `clipPath` 创建驻留在对象中的相应结构实例。“clipPath”

Parameters:

Name	Type	Attributes	Description
`object`	Object
`context`	Object	<optional>	assign enlived props to this object (pass null to skip this)为该对象分配enlived props(传递null跳过此操作)

Source:

fabric.js, line 1213

See:

fabric.Object.ENLIVEN_PROPS

(static) enlivenObjects(objects, callback, namespace, reviver)

Creates corresponding fabric instances from their object representations 从它们的对象表示创建相应的结构实例

Parameters:

Name	Type	Description
`objects`	Array	Objects to enliven对象要活泼
`callback`	function	Callback to invoke when all objects are created在创建所有对象时调用的回调
`namespace`	String	Namespace to get klass "Class" object from命名空间来获取类"Class"对象
`reviver`	function	Method for further parsing of object elements, called after each fabric object created.方法，用于进一步解析对象元素; 在创建每个fabric对象后调用。

Source:

fabric.js, line 1170

(static) enlivenPatterns(patterns, callback)

Create and wait for loading of patterns 创建并等待模式的加载

Parameters:

Name	Type	Description
`patterns`	Array	Objects to enliven对象要活泼
`callback`	function	Callback to invoke when all objects are created called after each fabric object created.在创建所有对象时调用的回调在创建每个fabric对象后调用。

Source:

fabric.js, line 1233

(static) falseFunction() → {Boolean}

Function which always returns `false`. 函数总是返回' false '。

Source:

fabric.js, line 1016

Returns:

Type: Boolean

(static) findScaleToCover(source, destination) → {Number}

Finds the scale for the object source to cover entirely the object destination, keeping aspect ratio intact. respect the total allowed area for the cache. 查找对象源覆盖整个对象目的地的比例，保持长宽比不变。尊重缓存的总允许区域。

Parameters:

Name Type Description

source

Object | fabric.Object

Properties

Name	Type	Description
`height`	Number	natural unscaled height of the object对象的自然未缩放高度
`width`	Number	natural unscaled width of the object对象的自然未缩放宽度

属性名字类型描述高度数量对象的自然未缩放高度宽度数量对象的自然未缩放宽度

destination

Object | fabric.Object

Properties

Name	Type	Description
`height`	Number	natural unscaled height of the object对象的自然未缩放高度
`width`	Number	natural unscaled width of the object对象的自然未缩放宽度

属性名字类型描述高度数量对象的自然未缩放高度宽度数量对象的自然未缩放宽度

Source:

fabric.js, line 1686

Returns:

scale factor to apply to source to cover destination

Type: Number

(static) findScaleToFit(source, destination) → {Number}

Finds the scale for the object source to fit inside the object destination, keeping aspect ratio intact. respect the total allowed area for the cache. 查找对象源的比例以适应对象目标，保持长宽比不变。尊重缓存的总允许区域。

Parameters:

Name Type Description

source

Object | fabric.Object

Properties

Name	Type	Description
`height`	Number	natural unscaled height of the object对象的自然未缩放高度
`width`	Number	natural unscaled width of the object对象的自然未缩放宽度

属性名字类型描述高度数量对象的自然未缩放高度宽度数量对象的自然未缩放宽度

destination

Object | fabric.Object

Properties

Name	Type	Description
`height`	Number	natural unscaled height of the object对象的自然未缩放高度
`width`	Number	natural unscaled width of the object对象的自然未缩放宽度

属性名字类型描述高度数量对象的自然未缩放高度宽度数量对象的自然未缩放宽度

Source:

fabric.js, line 1669

Returns:

scale factor to apply to source to fit into destination

Type: Number

(static) getBisector(A, B, C) → {Object}

Parameters:

Name	Type	Description
`A`	Point
`B`	Point
`C`	Point

Source:

fabric.js, line 812

Returns:

vector representing the bisector of A and A's angle

Type: Object

(static) getById(id) → {HTMLElement|null}

Takes id and returns an element with that id (if one exists in a document) 接受id并返回带有该id的元素(如果文档中存在该元素)

Parameters:

Name	Type	Description
`id`	String \| HTMLElement

Source:

fabric.js, line 3212

Returns:

Type: HTMLElement | null

(static) getElementOffset(element) → {Object}

Returns offset for a given element 返回给定元素的偏移量

Parameters:

Name	Type	Description
`element`	HTMLElement	Element to get offset for要获得偏移量的元素

Source:

fabric.js, line 3344

Returns:

Object with "left" and "top" properties

Type: Object

(static) getHatVector(v) → {Point}

Parameters:

Name	Type	Description
`v`	Point

Source:

fabric.js, line 800

Returns:

vector representing the unit vector of pointing to the direction of `v`

Type: Point

(static) getKlass(type, namespace) → {Object}

Returns klass "Class" object of given namespace 返回给定命名空间的类"Class"对象

Parameters:

Name	Type	Description
`type`	String	Type of object (eg. 'circle')对象的类型(例如:“圆”)
`namespace`	String	Namespace to get klass "Class" object from命名空间来获取类"Class"对象

Source:

fabric.js, line 1027

Returns:

klass "Class"

Type: Object

(static) getRandomInt(min, max) → {Number}

Returns random number between 2 specified ones. 返回两个指定数字之间的随机数。

Parameters:

Name	Type	Description
`min`	Number	lower limit下限
`max`	Number	upper limit上限

Source:

fabric.js, line 705

Returns:

random value (between min and max)

Type: Number

(static) getScrollLeftTop(element) → {Object}

Returns element scroll offsets 返回元素滚动偏移量

Parameters:

Name	Type	Description
`element`	HTMLElement	Element to operate on要操作的元素

Source:

fabric.js, line 3302

Returns:

Object with left/top values

Type: Object

(static) getSvgAttributes(type) → {Array}

Returns array of attributes for given svg that fabric parses 返回fabric解析的给定svg的属性数组

Parameters:

Name	Type	Description
`type`	String	Type of svg element (eg. 'circle')svg元素的类型(例如:“圆”)

Source:

fabric.js, line 1039

Returns:

string names of supported attributes

Type: Array

(static) groupSVGElements(elements, optionsopt, path) → {fabric.Object|fabric.Group}

Groups SVG elements (usually those retrieved from SVG document) 对SVG元素进行分组(通常是从SVG文档中检索的元素)

Parameters:

Name	Type	Attributes	Description
`elements`	Array		SVG elements to groupSVG元素分组
`options`	Object	<optional>	Options object选择对象
`path`	String		Value to set sourcePath to将sourcePath设置为的值

Source:

fabric.js, line 1274

Returns:

Type: fabric.Object | fabric.Group

(static) invertTransform(t) → {Array}

Invert transformation t 逆变换t

Parameters:

Name	Type	Description
`t`	Array	The transform转换

Source:

fabric.js, line 952

Returns:

The inverted transform

Type: Array

(static) isTransparent(ctx, x, y, tolerance)

Returns true if context has transparent pixel at specified location (taking tolerance into account) 如果上下文具有透明像素则返回true 在指定位置(考虑公差)

Parameters:

Name	Type	Description
`ctx`	CanvasRenderingContext2D	context上下文
`x`	Number	x coordinatex坐标
`y`	Number	y coordinatey坐标
`tolerance`	Number	Tolerance宽容

Source:

fabric.js, line 1549

(static) joinPath(pathData) → {String}

Join path commands to go back to svg format 连接路径命令返回到svg格式

Parameters:

Name	Type	Description
`pathData`	Array	fabricJS parsed path commandsfabricJS解析路径命令

Source:

fabric.js, line 2663

Returns:

joined path 'M 0 0 L 20 30'

Type: String

(static) limitDimsByArea(ar, maximumArea) → {Object.x|Object.y}

Given current aspect ratio, determines the max width and height that can respect the total allowed area for the cache. 给定当前宽高比，确定可以的最大宽度和高度尊重缓存的总允许区域。

Parameters:

Name	Type	Description
`ar`	Number	aspect ratio纵横比
`maximumArea`	Number	Maximum area you want to achieve你想达到的最大面积

Source:

fabric.js, line 1646

Returns:

Limited dimensions by X

Type

Object.x
Limited dimensions by Y

Type

Object.y

(static) loadImage(url, callback, contextopt, crossOriginopt)

Loads image element from given url and passes it to a callback 从给定的url加载图像元素并将其传递给回调函数

Parameters:

Name	Type	Attributes	Description
`url`	String		URL representing an image表示图像的URL
`callback`	function		Callback; invoked with loaded image回调;用加载的图像调用
`context`	*	<optional>	Context to invoke callback in上下文中调用回调
`crossOrigin`	Object	<optional>	crossOrigin value to set image element to设置图像元素的值

Source:

fabric.js, line 1090

(static) loadImageInDom(img, callback) → {Object}

Attaches SVG image with data: URL to the dom 将带有data: URL的SVG图像附加到dom

Parameters:

Name	Type	Description
`img`	Object	Image object with data:image/svg src带有数据的图像对象:Image /svg src
`callback`	function	Callback; invoked with loaded image回调;用加载的图像调用

Source:

fabric.js, line 1141

Returns:

DOM element (div containing the SVG image)

Type: Object

(static) makeBoundingBoxFromPoints(points, transformopt) → {Object}

Returns coordinates of points's bounding rectangle (left, top, width, height) 返回点的边界矩形的坐标(左，上，宽，高)

Parameters:

Name	Type	Attributes	Description
`points`	Array		4 points array四点阵列
`transform`	Array	<optional>	an array of 6 numbers representing a 2x3 transform matrix一个由6个数字组成的数组，表示2x3变换矩阵

Source:

fabric.js, line 922

Returns:

Object with left, top, width, height properties

Type: Object

(static) makeElement(tagName, attributesopt) → {HTMLElement}

Creates specified element with specified attributes 创建具有指定属性的指定元素

Parameters:

Name	Type	Attributes	Description
`tagName`	String		Type of an element to create要创建的元素类型
`attributes`	Object	<optional>	Attributes to set on an element要在元素上设置的属性

Source:

fabric.js, line 3249

Returns:

Newly created element

Type: HTMLElement

(static) makeElementSelectable(element) → {HTMLElement}

Makes element selectable 使元素可选

Parameters:

Name	Type	Description
`element`	HTMLElement	Element to make selectable元素使其可选

Source:

fabric.js, line 3439

Returns:

Element that was passed in

Type: HTMLElement

(static) makeElementUnselectable(element) → {HTMLElement}

Makes element unselectable 使元素不可选择

Parameters:

Name	Type	Description
`element`	HTMLElement	Element to make unselectable元素使其不可选择

Source:

fabric.js, line 3420

Returns:

Element that was passed in

Type: HTMLElement

(static) matrixToSVG(transform) → {String|Object.y}

given an array of 6 number returns something like `"matrix(...numbers)"` 给定6个数字的数组返回类似于“矩阵(…数字)”的东西。“‘

Parameters:

Name	Type	Description
`transform`	Array	an array with 6 numbers一个包含6个数字的数组

Source:

fabric.js, line 1697

Returns:

transform matrix for svg

Type

String
Limited dimensions by Y

Type

Object.y

(static) mergeClipPaths(c1, c2) → {fabric.Object}

Merges 2 clip paths into one visually equal clip path **IMPORTANT**:\ Does **NOT** clone the arguments, clone them proir if necessary. Creates a wrapper (group) that contains one clip path and is clipped by the other so content is kept where both overlap. Use this method if both the clip paths may have nested clip paths of their own, so assigning one to the other's clip path property is not possible. In order to handle the `inverted` property we follow logic described in the following cases:\ **(1)** both clip paths are inverted - the clip paths pass the inverted prop to the wrapper and loose it themselves.\ **(2)** one is inverted and the other isn't - the wrapper shouldn't become inverted and the inverted clip path must clip the non inverted one to produce an identical visual effect.\ **(3)** both clip paths are not inverted - wrapper and clip paths remain unchanged. 将2个剪辑路径合并为一个视觉上相等的剪辑路径 * *重要* *:\ 不**不**克隆参数，必要时克隆它们。创建包含一个剪辑路径并被另一个剪辑路径剪辑的包装器(组)，以便内容保留在两者重叠的地方。如果两个剪辑路径可能都有它们自己的嵌套剪辑路径，因此无法将一个剪辑路径分配给另一个剪辑路径属性，则使用此方法。为了处理“倒置”属性，我们遵循以下情况下描述的逻辑 **(1)**两个剪辑路径都是反向的-剪辑路径将反向的道具传递给包装器并自己松散它 **(2)**一个是倒立的，另一个不是-包装不应该变成倒立的，倒立的剪辑路径必须夹住非倒立的剪辑路径，以产生相同的视觉效果 **(3)**两个剪辑路径都不是反向的-包装器和剪辑路径保持不变。

Parameters:

Name	Type	Description
`c1`	fabric.Object
`c2`	fabric.Object

Source:

fabric.js, line 1818

Returns:

merged clip path

Type: fabric.Object

(static) multiplyTransformMatrices(a, b, is2x2) → {Array}

Multiply matrix A by matrix B to nest transformations 矩阵A乘以矩阵B来嵌套变换

Parameters:

Name	Type	Description
`a`	Array	First transformMatrix第一个transformMatrix
`b`	Array	Second transformMatrix第二个transformMatrix
`is2x2`	Boolean	flag to multiply matrices as 2x2 matrices标志矩阵相乘为2x2矩阵

Source:

fabric.js, line 1373

Returns:

The product of the two transform matrices

Type: Array

(static) parsePreserveAspectRatioAttribute(attribute) → {Object}

Parse preserveAspectRatio attribute from element 从元素中解析preserveAspectRatio属性

Parameters:

Name	Type	Description
`attribute`	string	to be parsed待解析

Source:

fabric.js, line 1591

Returns:

an object containing align and meetOrSlice attribute

Type: Object

(static) parseUnit(value, fontSize) → {Number|String}

Converts from attribute value to pixel value if applicable. Returns converted pixels or original value not converted. 如果适用，将属性值转换为像素值。返回转换后的像素或未转换的原始值。

Parameters:

Name	Type	Description
`value`	Number \| String	number to operate on手术编号
`fontSize`	Number

Source:

fabric.js, line 980

Returns:

Type: Number | String

(static) populateWithProperties(source, destination) → {Array}

Populates an object with properties of another object 用另一个对象的属性填充一个对象

Parameters:

Name	Type	Description
`source`	Object	Source object源对象
`destination`	Object	Destination object目标物体

Source:

fabric.js, line 1306

Returns:

properties Properties names to include

Type: Array

(static) projectStrokeOnPoints(points, options, openPathopt) → {Array.<fabric.Point>}

Project stroke width on points returning 2 projections for each point as follows: - `miter`: 2 points corresponding to the outer boundary and the inner boundary of stroke. - `bevel`: 2 points corresponding to the bevel boundaries, tangent to the bisector. - `round`: same as `bevel` Used to calculate object's bounding box 投影点的描边宽度，每个点返回2个投影，如下所示: -“人字”:两个点对应笔画的外边界和内边界。 -“斜面”:对应斜面边界的2个点，与平分线相切。 - ' round ':与' bevel '相同用于计算对象的边界框

Parameters:

Name Type Attributes Description

points Array.<Point>

options

Object

Properties

Name	Type	Description
`strokeWidth`	number
`strokeLineJoin`	'miter' \| 'bevel' \| 'round'
`strokeMiterLimit`	number	https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-miterlimithttps://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-miterlimit
`strokeUniform`	boolean
`scaleX`	number
`scaleY`	number

属性名字类型描述 strokeWidth 数量 strokeLineJoin “斜” | “斜” | “圆” strokeMiterLimit 数量 https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-miterlimit strokeUniform 布尔 scaleX 数量写入scaleY 数量

openPath boolean <optional> whether the shape is open or not, affects the calculations of the first and last points形状是否开放，影响第一个点和最后一个点的计算

Source:

fabric.js, line 843

Returns:

array of size 2n/4n of all suspected points

Type: Array.<fabric.Point>

(static) qrDecompose(a) → {Object}

Decomposes standard 2x3 matrix into transform components 将标准2x3矩阵分解为变换分量

Parameters:

Name	Type	Description
`a`	Array	transformMatrixtransformMatrix

Source:

fabric.js, line 1392

Returns:

Components of transform

Type: Object

(static) radiansToDegrees(radians) → {Number}

Transforms radians to degrees. 将弧度转换为角度。

Parameters:

Name	Type	Description
`radians`	Number	value in radians弧度值

Source:

fabric.js, line 727

Returns:

value in degrees

Type: Number

(static) removeFromArray(array, value) → {Array}

Removes value from an array. Presence of value (and its position in an array) is determined via `Array.prototype.indexOf` 从数组中移除值。值的存在(及其在数组中的位置)是通过' array .prototype. indexof '来确定的

Parameters:

Name	Type	Description
`array`	Array
`value`	*

Source:

fabric.js, line 689

Returns:

original array

Type: Array

(static) removeListener(element, eventName, handler)

Removes an event listener from an element 从元素中删除事件侦听器

Parameters:

Name	Type	Description
`element`	HTMLElement
`eventName`	String
`handler`	function

Source:

fabric.js, line 3102

(static) removeTransformFromObject(object, transform)

given an object and a transform, apply the inverse transform to the object, this is equivalent to remove from that object that transformation, so that added in a space with the removed transform, the object will be the same as before. Removing from an object a transform that scale by 2 is like scaling it by 1/2. Removing from an object a transfrom that rotate by 30deg is like rotating by 30deg in the opposite direction. This util is used to add objects inside transformed groups or nested groups. 给定一个对象和一个变换，对这个对象应用逆变换，这等价于从那个对象移除那个变换，所以在移除变换后的空间中添加，对象将与之前相同。从一个对象移除缩放2的变换就像缩放1/2。从一个物体上移去一个旋转30度的位移就像旋转了30度相反的方向。此工具用于在转换后的组或嵌套组中添加对象。

Parameters:

Name	Type	Description
`object`	fabric.Object	the object you want to transform要变换的对象
`transform`	Array	the destination transform目标变换

Source:

fabric.js, line 1715

(static) request(url, optionsopt) → {XMLHttpRequest}

Cross-browser abstraction for sending XMLHttpRequest 发送XMLHttpRequest的跨浏览器抽象

Parameters:

Name Type Attributes Description

url String URL to send XMLHttpRequest to将XMLHttpRequest发送到的URL

options

Object

Options object

Properties

Name	Type	Attributes	Default	Description
`method`	String	<optional>	"GET"
`parameters`	String	<optional>		parameters to append to url in GET or in body在GET或body中附加到url的参数
`body`	String	<optional>		body to send with POST or PUT request与POST或PUT请求一起发送的
`onComplete`	function			Callback to invoke when request is completed请求完成时要调用的回调

选择对象属性名字类型属性默认的描述方法字符串 “获得” 参数字符串在GET或body中附加到url的参数身体字符串与POST或PUT请求一起发送的 onComplete 函数请求完成时要调用的回调

Source:

fabric.js, line 3523

Returns:

request

Type: XMLHttpRequest

(static) requestAnimFrame(callback, element)

requestAnimationFrame polyfill based on http://paulirish.com/2011/requestanimationframe-for-smart-animating/ In order to get a precise start time, `requestAnimFrame` should be called as an entry into the method requestAnimationFrame polyfill基于http://paulirish.com/2011/requestanimationframe-for-smart-animating/ 为了获得精确的开始时间，应该调用' requestAnimFrame '作为方法的入口

Parameters:

Name	Type	Description
`callback`	function	Callback to invoke要调用的回调
`element`	DOMElement	optional Element to associate with animation与动画关联的可选元素

Source:

fabric.js, line 3789

(static) resetObjectTransform(target)

reset an object transform state to neutral. Top and left are not accounted for 将对象转换状态重置为中性。上面和左边没有考虑

Parameters:

Name	Type	Description
`target`	fabric.Object	object to transform要转换的对象

Source:

fabric.js, line 1510

(static) resolveNamespace(namespace) → {Object}

Returns object of given namespace 返回给定命名空间的对象

Parameters:

Name	Type	Description
`namespace`	String	Namespace string e.g. 'fabric.Image.filter' or 'fabric'命名空间字符串。“fabric.Image。“过滤器”或“织物”

Source:

fabric.js, line 1066

Returns:

Object for given namespace (default fabric)

Type: Object

(static) rotatePoint(point, origin, radians) → {fabric.Point}

Rotates `point` around `origin` with `radians` 用弧度围绕原点旋转“点”

Parameters:

Name	Type	Description
`point`	fabric.Point	The point to rotate要旋转的点
`origin`	fabric.Point	The origin of the rotation旋转的原点
`radians`	Number	The radians of the angle for the rotation旋转角度的弧度

Source:

fabric.js, line 740

Returns:

The new rotated point

Type: fabric.Point

(static) rotateVector(vector, radians) → {Object}

Rotates `vector` with `radians` 用“弧度”旋转“矢量”

Parameters:

Name	Type	Description
`vector`	Object	The vector to rotate (x and y)要旋转的向量(x和y)
`radians`	Number	The radians of the angle for the rotation旋转角度的弧度

Source:

fabric.js, line 754

Returns:

The new rotated point

Type: Object

(static) saveObjectTransform(target) → {Object}

Extract Object transform values 提取对象变换值

Parameters:

Name	Type	Description
`target`	fabric.Object	object to read from要读取的对象

Source:

fabric.js, line 1527

Returns:

Components of transform

Type: Object

(static) setStyle(element, styles) → {HTMLElement}

Cross-browser wrapper for setting element's style 用于设置元素样式的跨浏览器包装器

Parameters:

Name	Type	Description
`element`	HTMLElement
`styles`	Object

Source:

fabric.js, line 3139

Returns:

Element that was passed as a first argument

Type: HTMLElement

(static) sin(angle) → {Number}

Calculate the sin of an angle, avoiding returning floats for known results 计算角度的正弦值，避免返回已知结果的浮点数

Parameters:

Name	Type	Description
`angle`	Number	the angle in radians or in degree角:以弧度或角度表示的角

Source:

fabric.js, line 665

Returns:

Type: Number

(static) sizeAfterTransform(width, height, options) → {Object.x|Object.y}

given a width and height, return the size of the bounding box that can contains the box with width/height with applied transform described in options. Use to calculate the boxes around objects for controls. 给定宽度和高度，返回边界框的大小它可以包含应用了变换的具有宽度/高度的框在选项中描述。用于计算控件对象周围的方框。

Parameters:

Name Type Description

width Number

height Number

options

Object

Properties

Name	Type	Description
`scaleX`	Number
`scaleY`	Number
`skewX`	Number
`skewY`	Number

属性名字类型描述 scaleX 数量写入scaleY 数量 skewX 数量 skewY 数量

Source:

fabric.js, line 1772

Returns:

width of containing

Type

Object.x
height of containing

Type

Object.y

(static) toArray(arrayLike) → {Array}

Converts an array-like object (e.g. arguments or NodeList) to an array 将类数组对象(如arguments或NodeList)转换为数组

Parameters:

Name	Type	Description
`arrayLike`	Object

Source:

fabric.js, line 3223

Returns:

Type: Array

(static) toDataURL(canvasEl, format, quality) → {String}

since 2.6.0 moved from canvas instance to utility. 自2.6.0以来，从画布实例移动到实用程序。

Parameters:

Name	Type	Description
`canvasEl`	CanvasElement	to copy size and content of复制…的大小和内容
`format`	String	'jpeg' or 'png', in some browsers 'webp' is ok too'jpeg'或'png'，在某些浏览器中'webp'也可以
`quality`	Number	<= 1 and > 0 0

Source:

fabric.js, line 1350

Returns:

data url

Type: String

(static) toFixed(number, fractionDigits) → {Number}

A wrapper around Number#toFixed, which contrary to native method returns number, not string. number# toFixed的包装器，与本机方法相反，它返回数字，而不是字符串。

Parameters:

Name	Type	Description
`number`	Number \| String	number to operate on手术编号
`fractionDigits`	Number	number of fraction digits to "leave"要“留下”的分数位数

Source:

fabric.js, line 969

Returns:

Type: Number

(static) transformPoint(p, t, ignoreOffsetopt) → {fabric.Point}

Apply transform t to point p 对点p应用变换t

Parameters:

Name	Type	Attributes	Description
`p`	fabric.Point		The point to transform要变换的点
`t`	Array		The transform转换
`ignoreOffset`	Boolean	<optional>	Indicates that the offset should not be applied指示不应用偏移量

Source:

fabric.js, line 903

Returns:

The transformed point

Type: fabric.Point

(static) wrapElement(element, wrapper, attributesopt) → {HTMLElement}

Wraps element with another element 用另一个元素包裹一个元素

Parameters:

Name	Type	Attributes	Description
`element`	HTMLElement		Element to wrap要包装的元素
`wrapper`	HTMLElement \| String		Element to wrap with元素进行换行
`attributes`	Object	<optional>	Attributes to set on a wrapper要在包装器上设置的属性

Source:

fabric.js, line 3285

Returns:

wrapper

Type: HTMLElement

Type Definitions

Point

Creates a vetor from points represented as a point 从表示为点的点创建一个矢量

Type:

Object

Properties:

Name	Type	Description
`x`	number
`y`	number

Source:

fabric.js, line 765

在线工具

快捷菜单 返回顶部