在线工具
网站地图    收藏    合作   
<

快捷菜单 返回顶部

fabric.js中文API

fabric.js中文在线API,fabric.js中文文档API大全

Class: Object

fabric.Object

new Object()

Root object class from which all 2d shape classes inherit from 所有2d形状类都从其继承的根对象类
Source:
Tutorials:
See:
Fires:
  • event:added
  • event:removed
  • event:selected
  • event:deselected
  • event:modified
  • event:modified
  • event:moved
  • event:scaled
  • event:rotated
  • event:skewed
  • event:rotating
  • event:scaling
  • event:moving
  • event:skewing
  • event:mousedown
  • event:mouseup
  • event:mouseover
  • event:mouseout
  • event:mousewheel
  • event:mousedblclick
  • event:dragover
  • event:dragenter
  • event:dragleave
  • event:drop

Members

(static) __uid :Number

Unique id used internally when creating SVG elements 创建SVG元素时在内部使用的唯一id
Type:
  • Number
Source:

(static, constant) ENLIVEN_PROPS :Array.<string>

Defines which properties should be enlivened from the object passed to fabric.Object._fromObject 定义应该从传递给fabric.Object._fromObject的对象激活哪些属性
Type:
  • Array.<string>
Source:

(static, constant) NUM_FRACTION_DIGITS :Number

Defines the number of fraction digits to use when serializing object values. You can use it to increase/decrease precision of such values like left, top, scaleX, scaleY, etc. 定义序列化对象值时要使用的分数位数。 您可以使用它来增加/减少诸如left, top, scaleX, scaleY等值的精度。
Type:
  • Number
Source:

__corner :number|string|any

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. 在鼠标移动期间保持最后一个悬停角的值。 0没有角,或者'mt', 'ml', 'mtr'等。 它应该是私人的,但把它当作 只读属性。
Type:
  • number | string | any
Default Value:
  • 0
Source:

absolutePositioned :boolean

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 只有当对象用作clipPath时才有意义。 如果为true,则clipPath的顶部和左侧相对于画布 不受对象变换的影响。这将使clipPath相对 到画布,但是只裁剪一个特定的对象。 警告:这是测试版,此功能可能会更改或重命名。 自从测试盒框
Type:
  • boolean
Default Value:
  • false
Source:

aCoords

Describe object's corner position in canvas object absolute coordinates properties are tl,tr,bl,br and describe the four main corner. each property is an object with x, y, instance of Fabric.Point. The coordinates depends from this properties: width, height, scaleX, scaleY skewX, skewY, angle, strokeWidth, top, left. Those coordinates are useful to understand where an object is. They get updated with oCoords but they do not need to be updated when zoom or panning change. The coordinates get updated with @method setCoords. You can calculate them without updating with @method calcACoords(); 在画布对象绝对坐标中描述对象的角位置 属性是tl,tr,bl,br和描述四个主要角。 每个属性都是一个对象,有x, y, Fabric.Point的实例。 坐标取决于以下属性:宽度,高度,scaleX, scaleY skewX, skewY, angle, strokeWidth, top, left。 这些坐标对于了解物体的位置很有用。它们会更新 使用ocoord,但是当缩放或平移改变时,它们不需要更新。 坐标通过@method setcoord得到更新。 你可以使用@method calcACoords()计算它们而不需要更新;
Source:

angle :Number

Angle of rotation of an object (in degrees) 物体的旋转角度(以度为单位)
Type:
  • Number
Source:

backgroundColor :String

Background color of an object. takes css colors https://www.w3.org/TR/css-color-3/ 对象的背景颜色。 取css颜色https://www.w3.org/TR/css-color-3/
Type:
  • String
Source:

borderColor :String

Color of controlling borders of an object (when it's active) 控制对象边界的颜色(当它处于活动状态时)
Type:
  • String
Default Value:
  • rgb(178,204,255)
Source:

borderDashArray :Array

Array specifying dash pattern of an object's borders (hasBorder must be true) 指定对象边界的破折号模式的数组(hasBorder必须为true)
Type:
  • Array
Since:
  • 1.6.2
Source:

borderOpacityWhenMoving :Number

Opacity of object's controlling borders when object is active and moving 当物体处于活动和移动状态时,物体控制边界的不透明度
Type:
  • Number
Default Value:
  • 0.4
Source:

borderScaleFactor :Number

Scale factor of object's controlling borders bigger number will make a thicker border border is 1, so this is basically a border thickness since there is no way to change the border itself. 对象控制边界的比例因子 数字越大边框越粗 Border是1,这是边框的厚度 因为没有办法改变边界本身。
Type:
  • Number
Default Value:
  • 1
Source:

cacheProperties :Array

List of properties to consider when checking if cache needs refresh Those properties are checked by statefullCache ON ( or lazy mode if we want ) or from single 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 检查缓存是否需要刷新时要考虑的属性列表 这些属性通过statfullcache ON(或者我们想要的惰性模式)或从single检查 调用对象。集(关键字,值)。如果键在此列表中,则该对象被标记为脏对象 并在下一次渲染时刷新
Type:
  • Array
Source:

centeredRotation :Boolean

When true, this object will use center point as the origin of transformation when being rotated via the controls. Backwards incompatibility note: This property replaces "centerTransform" (Boolean). 当为true时,该对象将使用中心点作为转换的原点 当通过控件旋转时。 向后不兼容注意:此属性取代"centerTransform"(布尔值)。
Type:
  • Boolean
Since:
  • 1.3.4
Default Value:
  • true
Source:

centeredScaling :Boolean

When true, this object will use center point as the origin of transformation when being scaled via the controls. Backwards incompatibility note: This property replaces "centerTransform" (Boolean). 当为true时,该对象将使用中心点作为转换的原点 当通过控件缩放时。 向后不兼容注意:此属性取代"centerTransform"(布尔值)。
Type:
  • Boolean
Since:
  • 1.3.4
Source:

clipPath :fabric.Object

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' 一个没有描边的fabricObject,用它们的形状定义一个裁剪区域。用黑色填充 clipPath对象在对象呈现完毕时使用,并且上下文被放置在中心位置 对象cacheccanvas。 如果您希望clipPath的0,0与对象中心对齐,请使用clipPath。originX/Y到'center'
Type:
Source:

colorProperties :Array

List of properties to consider for animating colors. 动画颜色时要考虑的属性列表。
Type:
  • Array
Source:

controls

custom controls interface controls are added by default_controls.js 自定义控件界面 控件由default_controls.js添加
Source:

cornerColor :String

Color of controlling corners of an object (when it's active) 对象控制角的颜色(当它处于活动状态时)
Type:
  • String
Default Value:
  • rgb(178,204,255)
Source:

cornerDashArray :Array

Array specifying dash pattern of an object's control (hasBorder must be true) 指定对象控件的破折号模式的数组(hasBorder必须为true)
Type:
  • Array
Since:
  • 1.6.2
Source:

cornerSize :Number

Size of object's controlling corners (in pixels) 对象控制角的大小(以像素为单位)
Type:
  • Number
Default Value:
  • 13
Source:

cornerStrokeColor :String

Color of controlling corners of an object (when it's active and transparentCorners false) 对象控制角的颜色(当它处于活动状态且为transparentCorners false时)
Type:
  • String
Since:
  • 1.6.2
Source:

cornerStyle :String

Specify style of control, 'rect' or 'circle' 指定控件样式,“矩形”或“圆形”
Type:
  • String
Since:
  • 1.6.2
Source:

dirty :Boolean

When set to `true`, object's cache will be rerendered next render call. since 1.7.0 当设置为“true”时,对象的缓存将在下一次渲染调用中重新渲染。 自从1.7.0
Type:
  • Boolean
Default Value:
  • true
Source:

evented :Boolean

When set to `false`, an object can not be a target of events. All events propagate through it. Introduced in v1.3.4 当设置为“false”时,对象不能成为事件的目标。所有事件都通过它传播。在v1.3.4中引入
Type:
  • Boolean
Default Value:
  • true
Source:

excludeFromExport :Boolean

When `true`, object is not exported in OBJECT/JSON 当' true '时,object不会在object /JSON中导出
Type:
  • Boolean
Since:
  • 1.6.3
Source:

fill :String

Color of object's fill takes css colors https://www.w3.org/TR/css-color-3/ 物体填充的颜色 取css颜色https://www.w3.org/TR/css-color-3/
Type:
  • String
Default Value:
  • rgb(0,0,0)
Source:

fillRule :String

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 `fabric.Object#globalCompositeOperation` instead) 填充规则,用于填充对象 可接受的值是非零、偶奇 向后不兼容注意:此属性在v1.4.12之前用于设置globalCompositeOperation(使用' fabric. info ')。对象# globalCompositeOperation '而不是)
Type:
  • String
Default Value:
  • nonzero
Source:

flipX :Boolean

When true, an object is rendered as flipped horizontally 当为true时,对象呈现为水平翻转
Type:
  • Boolean
Source:

flipY :Boolean

When true, an object is rendered as flipped vertically 当为true时,对象呈现为垂直翻转
Type:
  • Boolean
Source:

globalCompositeOperation :String

Composite rule used for canvas globalCompositeOperation 用于画布的复合规则
Type:
  • String
Default Value:
  • source-over
Source:

hasBorders :Boolean

When set to `false`, object's controlling borders are not rendered 当设置为“false”时,不渲染对象的控制边界
Type:
  • Boolean
Default Value:
  • true
Source:

hasControls :Boolean

When set to `false`, object's controls are not displayed and can not be used to manipulate object 当设置为' false '时,对象的控件不显示,并且不能用于操作对象
Type:
  • Boolean
Default Value:
  • true
Source:

height :Number

Object height 对象的高度
Type:
  • Number
Source:

hoverCursor :String

Default cursor value used when hovering over this object on canvas 当鼠标悬停在画布上的对象上时使用的默认光标值
Type:
  • String
Source:

includeDefaultValues :Boolean

When `false`, default object's values are not included in its serialization 当' false '时,默认对象的值不包含在其序列化中
Type:
  • Boolean
Default Value:
  • true
Source:

inverted :boolean

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 只有当对象用作clipPath时才有意义。 如果为true,则该clipPath将使对象剪辑到clipPath的外部 自从测试盒框
Type:
  • boolean
Default Value:
  • false
Source:

left :Number

Left position of an object. Note that by default it's relative to object left. You can change this by setting originX={left/center/right} 对象的左侧位置。注意,默认情况下它是相对于左对象的。你可以通过设置originX={left/center/right}来改变它
Type:
  • Number
Source:

lineCoords

Describe object's corner position in canvas element coordinates. includes padding. Used of object detection. set and refreshed with setCoords. 在画布元素坐标中描述对象的角位置。 包括填充。用于对象检测。 设置并使用setcoord刷新。
Source:

lockMovementX :Boolean

When `true`, object horizontal movement is locked 当为true时,对象水平移动被锁定
Type:
  • Boolean
Source:

lockMovementY :Boolean

When `true`, object vertical movement is locked 当为true时,对象的垂直移动被锁定
Type:
  • Boolean
Source:

lockRotation :Boolean

When `true`, object rotation is locked 当为true时,对象旋转被锁定
Type:
  • Boolean
Source:

lockScalingFlip :Boolean

When `true`, object cannot be flipped by scaling into negative values 当为true时,对象不能通过缩放为负值来翻转
Type:
  • Boolean
Source:

lockScalingX :Boolean

When `true`, object horizontal scaling is locked 当为true时,对象水平缩放被锁定
Type:
  • Boolean
Source:

lockScalingY :Boolean

When `true`, object vertical scaling is locked 当为true时,对象垂直缩放被锁定
Type:
  • Boolean
Source:

lockSkewingX :Boolean

When `true`, object horizontal skewing is locked 当为true时,对象水平倾斜被锁定
Type:
  • Boolean
Source:

lockSkewingY :Boolean

When `true`, object vertical skewing is locked 当为true时,对象垂直倾斜被锁定
Type:
  • Boolean
Source:

matrixCache

storage for object full transform matrix 存储对象的完整变换矩阵
Source:

minScaleLimit :Number

Minimum allowed scale value of an object 对象的最小允许缩放值
Type:
  • Number
Source:

moveCursor :String

Default cursor value used when moving this object on canvas 在画布上移动此对象时使用的默认游标值
Type:
  • String
Source:

noScaleCache :Boolean

When `true`, cache does not get updated during scaling. The picture will get blocky if scaled too much and will be redrawn with correct details at the end of scaling. this setting is performance and application dependant. default to true since 1.7.0 当为true时,缓存在扩展期间不会更新。如果缩放,这幅画会变得块状 太多,将在缩放结束时用正确的细节重新绘制。 此设置依赖于性能和应用程序。 默认为true 自从1.7.0
Type:
  • Boolean
Default Value:
  • true
Source:

objectCaching :Boolean

When `true`, object is cached on an additional canvas. When `false`, object is not cached unless necessary ( clipPath ) default to true 当为true时,对象被缓存在另一个画布上。 当' false '时,对象不缓存,除非必要(clipPath) 默认为true
Type:
  • Boolean
Since:
  • 1.7.0
Default Value:
  • true
Source:

oCoords

Describe object's corner position in canvas element coordinates. properties are depending on control keys and padding the main controls. each property is an object with x, y and corner. The `corner` property contains in a similar manner the 4 points of the interactive area of the corner. The coordinates depends from the controls positionHandler and are used to draw and locate controls 在画布元素坐标中描述对象的角位置。 属性依赖于控制键和填充主控件。 每个属性都是一个具有x, y和角的对象。 ' corner '属性以类似的方式包含 角落的互动区域。 坐标依赖于控件positionHandler并被使用 绘制和定位控件
Source:

opacity :Number

Opacity of an object 对象的不透明度
Type:
  • Number
Default Value:
  • 1
Source:

originX :String

Horizontal origin of transformation of an object (one of "left", "right", "center") See http://jsfiddle.net/1ow02gea/244/ on how originX/originY affect objects in groups 对象转换的水平原点(“左”、“右”、“中”之一) 请参阅http://jsfiddle.net/1ow02gea/244/了解originX/originY如何影响组中的对象
Type:
  • String
Default Value:
  • left
Source:

originY :String

Vertical origin of transformation of an object (one of "top", "bottom", "center") See http://jsfiddle.net/1ow02gea/244/ on how originX/originY affect objects in groups 对象变换的垂直原点(“顶”、“底”、“中”之一) 请参阅http://jsfiddle.net/1ow02gea/244/了解originX/originY如何影响组中的对象
Type:
  • String
Default Value:
  • top
Source:

ownMatrixCache

storage for object transform matrix 存储对象变换矩阵
Source:

padding :Number

Padding between object and its controlling borders (in pixels) 对象与其控制边界之间的填充(以像素为单位)
Type:
  • Number
Source:

paintFirst :String

Determines if the fill or the stroke is drawn first (one of "fill" or "stroke") 确定是先绘制填充还是描边("fill"或"stroke"中的一个)
Type:
  • String
Default Value:
  • fill
Source:

perPixelTargetFind :Boolean

When set to `true`, objects are "found" on canvas on per-pixel basis rather than according to bounding box 当设置为“true”时,对象是按像素在画布上“找到”的,而不是根据边界框
Type:
  • Boolean
Source:

scaleX :Number

Object scale factor (horizontal) 物体比例因子(水平)
Type:
  • Number
Default Value:
  • 1
Source:

scaleY :Number

Object scale factor (vertical) 物体比例因子(垂直)
Type:
  • Number
Default Value:
  • 1
Source:

selectable :Boolean

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. 当设置为“false”时,不能选择对象进行修改(使用基于点点击或基于组的选择)。 但事件仍在发生。
Type:
  • Boolean
Default Value:
  • true
Source:

selectionBackgroundColor :String

Selection Background color of an object. colored layer behind the object when it is active. does not mix good with globalCompositeOperation methods. 选择对象的背景颜色。当对象处于活动状态时,它后面的彩色图层。 不能很好地与globalCompositeOperation方法混合使用。
Type:
  • String
Source:

shadow :fabric.Shadow

Shadow object representing shadow of this shape 表示此形状的阴影的阴影对象
Type:
Source:

skewX :Number

Angle of skew on x axes of an object (in degrees) 物体在x轴上的倾斜角(以度为单位)
Type:
  • Number
Source:

skewY :Number

Angle of skew on y axes of an object (in degrees) 物体y轴上的倾斜角(以度为单位)
Type:
  • Number
Source:

statefullCache :Boolean

When `true`, object properties are checked for cache invalidation. In some particular situation you may want this to be disabled ( spray brush, very big, groups) or if your application does not allow you to modify properties for groups child you want to disable it for groups. default to false since 1.7.0 当' true '时,将检查对象属性是否缓存无效。在某些方面 您可能希望禁用此功能的情况(喷雾刷,非常大,组) 或者如果您的应用程序不允许您修改您想要的组子的属性 为组禁用它。 默认为false 自从1.7.0
Type:
  • Boolean
Default Value:
  • false
Source:

stateProperties :Array

List of properties to consider when checking if state of an object is changed (fabric.Object#hasStateChanged) as well as for history (undo/redo) purposes 检查if状态时要考虑的属性列表 (fabric. object# hasstatechange) 以及用于历史(撤销/重做)目的
Type:
  • Array
Source:

stroke :String

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/ 定义后,对象通过描边呈现,此属性指定其颜色 取css颜色https://www.w3.org/TR/css-color-3/
Type:
  • String
Source:

strokeDashArray :Array

Array specifying dash pattern of an object's stroke (stroke must be defined) 指定对象笔画的破折号模式的数组(必须定义笔画)
Type:
  • Array
Source:

strokeDashOffset :Number

Line offset of an object's stroke 对象笔画的线偏移量
Type:
  • Number
Source:

strokeLineCap :String

Line endings style of an object's stroke (one of "butt", "round", "square") 对象笔画的行尾样式(“尾”、“圆”、“方”之一)
Type:
  • String
Default Value:
  • butt
Source:

strokeLineJoin :String

Corner style of an object's stroke (one of "bevel", "round", "miter") 对象描边的角样式("bevel", "round", "miter"之一)
Type:
  • String
Default Value:
  • miter
Source:

strokeMiterLimit :Number

Maximum miter length (used for strokeLineJoin = "miter") of an object's stroke 对象笔画的最大斜接长度(用于strokeLineJoin = "斜接")
Type:
  • Number
Default Value:
  • 4
Source:

strokeUniform :Boolean

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 当为“false”时,斯托克宽度将随对象缩放。 当为true时,笔画将始终与输入笔画宽度的精确像素大小相匹配。 此属性不适用于使用strokeText,fillText方法的文本类或绘图调用 默认为false
Type:
  • Boolean
Since:
  • 2.6.0
Default Value:
  • false
Source:

strokeWidth :Number

Width of a stroke used to render this object 用于渲染此对象的描边宽度
Type:
  • Number
Default Value:
  • 1
Source:

top :Number

Top position of an object. Note that by default it's relative to object top. You can change this by setting originY={top/center/bottom} 对象的顶部位置。注意,默认情况下它是相对于对象top的。你可以通过设置originY={top/center/bottom}来改变它
Type:
  • Number
Source:

touchCornerSize :Number

Size of object's controlling corners when touch interaction is detected 当检测到触摸交互时,对象控制角的大小
Type:
  • Number
Default Value:
  • 24
Source:

transparentCorners :Boolean

When true, object's controlling corners are rendered as transparent inside (i.e. stroke instead of fill) 当为true时,对象的控制角被渲染为透明的内部(即描边而不是填充)
Type:
  • Boolean
Default Value:
  • true
Source:

type :String

Type of an object (rect, circle, path, etc.). Note that this property is meant to be read-only and not meant to be modified. If you modify, certain parts of Fabric (such as JSON loading) won't work correctly. 对象的类型(矩形、圆形、路径等)。 注意,这个属性是只读的,不能修改。 如果进行修改,Fabric的某些部分(如JSON加载)将无法正常工作。
Type:
  • String
Default Value:
  • object
Source:

visible :Boolean

When set to `false`, an object is not rendered on canvas 当设置为“false”时,对象不会在画布上渲染
Type:
  • Boolean
Default Value:
  • true
Source:

width :Number

Object width 对象的宽度
Type:
  • Number
Source:

Methods

_calcRotateMatrix() → {Array}

calculate rotation matrix of an object 计算对象的旋转矩阵
Source:
Returns:
rotation matrix for the object
Type
Array

_calcTranslateMatrix() → {Array}

calculate the translation matrix for an object transform 计算对象变换的平移矩阵
Source:
Returns:
rotation matrix for the object
Type
Array

_drawClipPath(ctx, clipPath)

Prepare clipPath state and cache and draw it on instance's cache 准备clipPath状态和缓存,并在实例的缓存上绘制它
Parameters:
Name Type Description
ctx CanvasRenderingContext2D
clipPath fabric.Object
Source:

_getCoords(absolute) → {Object}

return correct set of coordinates for intersection this will return either aCoords or lineCoords. 返回交点的正确坐标集 这将返回acoord或linecoord。
Parameters:
Name Type Description
absolute Boolean will return aCoords if true or lineCoords如果为true或lineCoords
Source:
Returns:
{tl, tr, br, bl} points
Type
Object

_limitCacheSize(dims) → {Object|Object|Object|Object}

Limit the cache dimensions so that X * Y do not cross fabric.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. 限制缓存尺寸,使X * Y不跨越fabric.perfLimitSizeTotal 并且每条边都不跨越fabric.cacheSideLimit 这些数字是可配置的,因此您可以获得尽可能多的细节 与演出讨价还价。
Parameters:
Name Type Description
dims Object
Properties
Name Type Description
width Object width of canvas帆布宽度
height Object height of canvas帆布高度
zoomX Object zoomX zoom value to unscale the canvas before drawing cachezoomX缩放值用于在绘制缓存之前取消画布的缩放
zoomY Object zoomY zoom value to unscale the canvas before drawing cache缩放值用于在绘制缓存之前取消画布的缩放
属性 名字 类型 描述 宽度 对象 帆布宽度 高度 对象 帆布高度 zoomX 对象 zoomX缩放值用于在绘制缓存之前取消画布的缩放 利用促镜拍摄的 对象 缩放值用于在绘制缓存之前取消画布的缩放
Source:
Returns:
  • .width width of canvas
    Type
    Object
  • .height height of canvas
    Type
    Object
  • .zoomX zoomX zoom value to unscale the canvas before drawing cache
    Type
    Object
  • .zoomY zoomY zoom value to unscale the canvas before drawing cache
    Type
    Object

_removeCacheCanvas()

Remove cacheCanvas and its dimensions from the objects 从对象中移除cacheccanvas及其维度
Source:

_renderControls(ctx, styleOverrideopt)

Renders controls and borders for the object the context here is not transformed 渲染对象的控件和边框 这里的上下文没有被转换
Parameters:
Name Type Attributes Description
ctx CanvasRenderingContext2D Context to render on要渲染的上下文
styleOverride Object <optional>
properties to override the object style属性来覆盖对象样式
Source:

_setupCompositeOperation(ctx)

Sets canvas globalCompositeOperation for specific object custom composition operation for the particular object can be specified using globalCompositeOperation property 为特定对象设置画布globalCompositeOperation 可以使用globalCompositeOperation属性指定特定对象的自定义组合操作
Parameters:
Name Type Description
ctx CanvasRenderingContext2D Rendering canvas context渲染画布上下文
Source:

adjustPosition(to)

Parameters:
Name Type Description
to String One of 'left', 'center', 'right'左,中,右中的一个
Source:

animate(property, value) → {fabric.Object|fabric.AnimationContext|Array.<fabric.AnimationContext>}

Animates object's properties 动画对象的属性
Parameters:
Name Type Description
property String | Object Property to animate (if string) or properties to animate (if object)动画属性(if string)或动画属性(if object)
value Number | Object Value to animate property to (if string was given first) or options object动画属性的值(如果先给出字符串)或选项对象
Source:
Tutorials:
Returns:
  • thisArg
    Type
    fabric.Object
  • animation context (or an array if passed multiple properties) As object — multiple properties object.animate({ left: ..., top: ... }); object.animate({ left: ..., top: ... }, { duration: ... }); As string — one property object.animate('left', ...); object.animate('left', { duration: ... });
    Type
    fabric.AnimationContext | Array.<fabric.AnimationContext>

bringForward(intersectingopt) → {fabric.Object}

Moves an object up in stack of drawn objects 在绘制的对象堆栈中向上移动一个对象
Parameters:
Name Type Attributes Description
intersecting Boolean <optional>
If `true`, send object in front of next upper intersecting object如果' true ',则将对象发送到下一个上部相交对象的前面
Source:
Returns:
thisArg
Type
fabric.Object

bringToFront() → {fabric.Object}

Moves an object to the top of the stack of drawn objects 将一个对象移动到绘制对象堆栈的顶部
Source:
Returns:
thisArg
Type
fabric.Object

calcOwnMatrix() → {Array}

calculate transform matrix that represents the current transformations from the object's properties, this matrix does not include the group transformation 计算表示从的当前变换的变换矩阵 对象的属性,这个矩阵不包括群变换
Source:
Returns:
transform matrix for the object
Type
Array

calcTransformMatrix(skipGroupopt) → {Array}

calculate transform matrix that represents the current transformations from the object's properties. 计算表示从的当前变换的变换矩阵 对象的属性。
Parameters:
Name Type Attributes Description
skipGroup Boolean <optional>
return transform matrix for object not counting parent transformations There are some situation in which this is useful to avoid the fake rotation.返回对象的变换矩阵,不包括父变换 在某些情况下,这有助于避免假旋转。
Source:
Returns:
transform matrix for the object
Type
Array

center() → {fabric.Object}

Centers object vertically and horizontally on canvas to which is was added last You might need to call `setCoords` on an object after centering, to update controls area. 对象在最后添加到的画布上垂直和水平居中 你可能需要在定心之后在一个对象上调用setcoord来更新控件区域。
Source:
Returns:
thisArg
Type
fabric.Object

centerH() → {fabric.Object}

Centers object horizontally on canvas to which it was added last. You might need to call `setCoords` on an object after centering, to update controls area. 将对象水平居中于最后添加到的画布上。 你可能需要在定心之后在一个对象上调用setcoord来更新控件区域。
Source:
Returns:
thisArg
Type
fabric.Object

centerV() → {fabric.Object}

Centers object vertically on canvas to which it was added last. You might need to call `setCoords` on an object after centering, to update controls area. 将对象垂直放置在最后添加到的画布上。 你可能需要在定心之后在一个对象上调用setcoord来更新控件区域。
Source:
Returns:
thisArg
Type
fabric.Object

clone(callback, propertiesToIncludeopt)

Clones an instance, using a callback method will work for every object. 克隆一个实例,使用回调方法将适用于每个对象。
Parameters:
Name Type Attributes Description
callback function Callback is invoked with a clone as a first argument使用克隆作为第一个参数调用回调
propertiesToInclude Array <optional>
Any properties that you might want to additionally include in the output您可能希望在输出中额外包含的任何属性
Source:

cloneAsImage(callback, optionsopt) → {fabric.Object}

Creates an instance of fabric.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. This method is sync now, but still support the callback because we did not want to break. When fabricJS 5.0 will be planned, this will probably be changed to not have a callback. 创建fabric实例。一个物体的图像 使用toCanvasElement。 一旦这个方法是基于toDataUrl和loadImage,那么它也有一个质量 和格式选项。toCanvasElement更快,并且不会产生质量损失。 如果您需要从对象中获取真正的Jpeg或Png,那么使用toDataURL是正确的方法。 toCanvasElement,然后从获得的画布toBlob也是一个不错的选择。 这个方法现在是同步的,但仍然支持回调,因为我们不想中断。 当计划发布fabricJS 5.0时,这可能会被更改为没有回调。
Parameters:
Name Type Attributes Description
callback function callback, invoked with an instance as a first argument回调,使用实例作为第一个参数调用
options Object <optional>
for clone as image, passed to toDataURL
Properties
Name Type Attributes Default Description
multiplier Number <optional>
1 Multiplier to scale by乘数乘以
left Number <optional>
Cropping left offset. Introduced in v1.2.14裁剪左偏移。在v1.2.14中引入
top Number <optional>
Cropping top offset. Introduced in v1.2.14裁剪顶部偏移。在v1.2.14中引入
width Number <optional>
Cropping width. Introduced in v1.2.14裁剪宽度。在v1.2.14中引入
height Number <optional>
Cropping height. Introduced in v1.2.14种植的高度。在v1.2.14中引入
enableRetinaScaling Boolean <optional>
Enable retina scaling for clone image. Introduce in 1.6.4启用视网膜缩放克隆图像。1.6.4引入
withoutTransform Boolean <optional>
Remove current object transform ( no scale , no angle, no flip, no skew ). Introduced in 2.3.4移除当前对象变换(无缩放、无角度、无翻转、无倾斜)。在2.3.4中引入
withoutShadow Boolean <optional>
Remove current object shadow. Introduced in 2.4.2移除当前对象阴影。2.4.2引入
将克隆作为图像传递给toDataURL 属性 名字 类型 属性 默认的 描述 乘数 数量 1 乘数乘以 左 数量 裁剪左偏移。在v1.2.14中引入 前 数量 裁剪顶部偏移。在v1.2.14中引入 宽度 数量 裁剪宽度。在v1.2.14中引入 高度 数量 种植的高度。在v1.2.14中引入 enableRetinaScaling 布尔 启用视网膜缩放克隆图像。1.6.4引入 withoutTransform 布尔 移除当前对象变换(无缩放、无角度、无翻转、无倾斜)。在2.3.4中引入 withoutShadow 布尔 移除当前对象阴影。2.4.2引入
Source:
Returns:
thisArg
Type
fabric.Object

complexity() → {Number}

Returns complexity of an instance 返回实例的复杂度
Source:
Returns:
complexity of this instance (is 1 unless subclassed)
Type
Number

containsPoint(point, linesopt, absoluteopt, calculateopt) → {Boolean}

Checks if point is inside the object 检查point是否在对象内部
Parameters:
Name Type Attributes Description
point fabric.Point Point to check against指向核对
lines Object <optional>
object returned from @method _getImageLines从@method _getImageLines返回的对象
absolute Boolean <optional>
use coordinates without viewportTransform使用不带viewportTransform的坐标
calculate Boolean <optional>
use coordinates of current position instead of .oCoords使用当前位置的坐标而不是。ocoordinates
Source:
Returns:
true if point is inside the object
Type
Boolean

dispose()

cancel instance's running animations 取消实例的运行动画
Source:

drawBorders(ctx, styleOverride) → {fabric.Object}

Draws borders of an object's bounding box. Requires public properties: width, height Requires public options: padding, borderColor 绘制对象的边界框的边界。 需要公共属性:宽度,高度 需要公共选项:padding, borderColor
Parameters:
Name Type Description
ctx CanvasRenderingContext2D Context to draw on要借鉴的背景
styleOverride Object object to override the object style对象来覆盖对象样式
Source:
Returns:
thisArg
Type
fabric.Object

drawBordersInGroup(ctx, options, styleOverride) → {fabric.Object}

Draws borders of an object's bounding box when it is inside a group. Requires public properties: width, height Requires public options: padding, borderColor 当对象处于组中时,绘制对象的边界框的边界。 需要公共属性:宽度,高度 需要公共选项:padding, borderColor
Parameters:
Name Type Description
ctx CanvasRenderingContext2D Context to draw on要借鉴的背景
options object object representing current object parameters对象,表示当前对象参数
styleOverride Object object to override the object style对象来覆盖对象样式
Source:
Returns:
thisArg
Type
fabric.Object

drawCacheOnCanvas(ctx)

Paint the cached copy of the object on the target context. 在目标上下文中绘制对象的缓存副本。
Parameters:
Name Type Description
ctx CanvasRenderingContext2D Context to render on要渲染的上下文
Source:

drawClipPathOnCache(ctx, clipPath)

Execute the drawing operation for an object clipPath 执行对象clipPath的绘图操作
Parameters:
Name Type Description
ctx CanvasRenderingContext2D Context to render on要渲染的上下文
clipPath fabric.Object
Source:

drawControls(ctx, styleOverride) → {fabric.Object}

Draws corners of an object's bounding box. Requires public properties: width, height Requires public options: cornerSize, padding 绘制对象边界框的角。 需要公共属性:宽度,高度 需要公共选项:cornerSize, padding
Parameters:
Name Type Description
ctx CanvasRenderingContext2D Context to draw on要借鉴的背景
styleOverride Object object to override the object style对象来覆盖对象样式
Source:
Returns:
thisArg
Type
fabric.Object

drawObject(ctx)

Execute the drawing operation for an object on a specified context 在指定的上下文中对对象执行绘图操作
Parameters:
Name Type Description
ctx CanvasRenderingContext2D Context to render on要渲染的上下文
Source:

drawSelectionBackground(ctx) → {fabric.Object}

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 在对象后面的选择边界内绘制一个彩色图层。 需要公共选项:padding, selectionBackgroundColor 在转换上下文时调用此函数 当对象在静态画布上时,是否有检查要跳过
Parameters:
Name Type Description
ctx CanvasRenderingContext2D Context to draw on要借鉴的背景
Source:
Returns:
thisArg
Type
fabric.Object

forEachControl(fn)

Calls a function for each control. The function gets called, with the control, the object that is calling the iterator and the control's key 为每个控件调用一个函数。函数被调用, 对于控件,调用迭代器的对象和控件的键
Parameters:
Name Type Description
fn function function to iterate over the controls over函数来迭代控件
Source:

fxStraighten(callbacks) → {fabric.Object}

Same as fabric.Object.prototype.straighten but with animation 与fabric. object .prototype.straight相同,但带有动画
Parameters:
Name Type Description
callbacks Object Object with callback functions
Properties
Name Type Attributes Description
onComplete function <optional>
Invoked on completion完成时调用
onChange function <optional>
Invoked on every step of animation在动画的每一步调用
具有回调函数的对象 属性 名字 类型 属性 描述 onComplete 函数 完成时调用 onChange 函数 在动画的每一步调用
Source:
Returns:
thisArg
Type
fabric.Object

getBoundingRect(absoluteopt, calculateopt) → {Object}

Returns coordinates of object's bounding rectangle (left, top, width, height) the box is intended as aligned to axis of canvas. 返回对象的边界矩形的坐标(左,上,宽,高) 该框要与画布的轴线对齐。
Parameters:
Name Type Attributes Description
absolute Boolean <optional>
use coordinates without viewportTransform使用不带viewportTransform的坐标
calculate Boolean <optional>
use coordinates of current position instead of .oCoords / .aCoords使用当前位置的坐标,而不是. ocoordinates / . acoord
Source:
Returns:
Object with left, top, width, height properties
Type
Object

getCenterPoint() → {fabric.Point}

Returns the real center coordinates of the object 返回对象的真实中心坐标
Source:
Returns:
Type
fabric.Point

getCoords() → {Array}

return correct set of coordinates for intersection this will return either aCoords or lineCoords. The coords are returned in an array. 返回交点的正确坐标集 这将返回acoord或linecoord。 字符串以数组形式返回。
Source:
Returns:
[tl, tr, br, bl] of points
Type
Array

getLocalPointer(e, pointeropt) → {Object}

Returns coordinates of a pointer relative to an object 返回指针相对于对象的坐标
Parameters:
Name Type Attributes Description
e Event Event to operate upon要操作的事件
pointer Object <optional>
Pointer to operate upon (instead of event)要操作的指针(而不是事件)
Source:
Returns:
Coordinates of a pointer (x, y)
Type
Object

getObjectOpacity() → {Number}

Return the object opacity counting also the group property 返回对象的不透明度计数和组属性
Source:
Returns:
Type
Number

getObjectScaling() → {Object}

Return the object scale factor counting also the group scaling 返回对象缩放因子计数以及组缩放
Source:
Returns:
object with scaleX and scaleY properties
Type
Object

getPointByOrigin(originX, originY) → {fabric.Point}

Returns the coordinates of the object as if it has a different origin 返回对象的坐标,就好像它有不同的原点一样
Parameters:
Name Type Description
originX String Horizontal origin: 'left', 'center' or 'right'水平原点:“左”、“中”或“右”
originY String Vertical origin: 'top', 'center' or 'bottom'垂直原点:'top', 'center'或'bottom'
Source:
Returns:
Type
fabric.Point

getScaledHeight() → {Number}

Returns height of an object bounding box counting transformations before 2.0 it was named getHeight(); 返回计算转换的对象边界框的高度 在2.0之前,它被命名为getHeight();
Source:
Returns:
height value
Type
Number

getScaledWidth() → {Number}

Returns width of an object's bounding box counting transformations before 2.0 it was named getWidth(); 返回对象的边界框计数转换的宽度 在2.0之前,它被命名为getWidth();
Source:
Returns:
width value
Type
Number

getSvgCommons() → {String}

Returns id attribute for svg output 返回svg输出的id属性
Source:
Returns:
Type
String

getSvgFilter() → {String}

Returns filter for svg shadow 返回svg阴影滤镜
Source:
Returns:
Type
String

getSvgSpanStyles(style, useWhiteSpace) → {String}

Returns styles-string for svg-export 返回svg-export的样式字符串
Parameters:
Name Type Description
style Object the object from which to retrieve style properties要从中检索样式属性的对象
useWhiteSpace Boolean a boolean to include an additional attribute in the style.布尔值,用于在样式中包含附加属性。
Source:
Returns:
Type
String

getSvgStyles(skipShadow) → {String}

Returns styles-string for svg-export 返回svg-export的样式字符串
Parameters:
Name Type Description
skipShadow Boolean a boolean to skip shadow filter output跳过阴影过滤器输出的布尔值
Source:
Returns:
Type
String

getSvgTextDecoration(style) → {String}

Returns text-decoration property for svg-export 返回svg-export的文本装饰属性
Parameters:
Name Type Description
style Object the object from which to retrieve style properties要从中检索样式属性的对象
Source:
Returns:
Type
String

getSvgTransform(use) → {String}

Returns transform-string for svg-export 返回svg导出的转换字符串
Parameters:
Name Type Description
use Boolean the full transform or the single object one.完整的变换或者单个对象的变换。
Source:
Returns:
Type
String

getTotalObjectScaling() → {Object}

Return the object scale factor counting also the group scaling, zoom and retina 返回对象缩放因子计数以及组缩放、缩放和视网膜
Source:
Returns:
object with scaleX and scaleY properties
Type
Object

getViewportTransform() → {Array}

Retrieves viewportTransform from Object's canvas if possible 如果可能的话,从对象的画布中检索viewportTransform
Source:
Returns:
Type
Array

hasFill()

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. 如果对象要绘制填充,则返回true 不考虑文本样式。这只是在渲染时使用的快捷方式 我们希望它是一个近似值,而且要快。 为了避免额外的缓存,它必须在填充发生时返回true, 能以100%的几率猜出什么时候不会发生,错过了也没关系 一些用例中填充是不可见的。
Since:
  • 3.0.0
Source:
Returns:
Boolean

hasStateChanged(propertySetopt) → {Boolean}

Returns true if object state (one of its state properties) was changed 如果对象状态(它的状态属性之一)被改变,返回true
Parameters:
Name Type Attributes Description
propertySet String <optional>
optional name for the set of property we want to save要保存的属性集的可选名称
Source:
Returns:
true if instance' state has changed since `fabric.Object#saveState` was called
Type
Boolean

hasStroke()

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. 如果对象将绘制笔画,则返回true 不考虑文本样式。这只是在渲染时使用的快捷方式 我们希望它是一个近似值,而且要快。 为了避免额外的缓存,它必须在笔划发生时返回true, 能以100%的几率猜出什么时候不会发生,错过了也没关系 在某些用例中,笔画是不可见的。
Since:
  • 3.0.0
Source:
Returns:
Boolean

initialize(optionsopt)

Constructor 构造函数
Parameters:
Name Type Attributes Description
options Object <optional>
Options object选择对象
Source:

intersectsWithObject(other, absoluteopt, calculateopt) → {Boolean}

Checks if object intersects with another object 检查对象是否与另一个对象相交
Parameters:
Name Type Attributes Description
other Object Object to test测试对象
absolute Boolean <optional>
use coordinates without viewportTransform使用不带viewportTransform的坐标
calculate Boolean <optional>
use coordinates of current position instead of .oCoords使用当前位置的坐标而不是。ocoordinates
Source:
Returns:
true if object intersects with another object
Type
Boolean

intersectsWithRect(pointTL, pointBR, absoluteopt, calculateopt) → {Boolean}

Checks if object intersects with an area formed by 2 points 检查对象是否与由两点组成的区域相交
Parameters:
Name Type Attributes Description
pointTL Object top-left point of area区域的左上角点
pointBR Object bottom-right point of area区域的右下点
absolute Boolean <optional>
use coordinates without viewportTransform使用不带viewportTransform的坐标
calculate Boolean <optional>
use coordinates of current position instead of .oCoords使用当前位置的坐标而不是。ocoordinates
Source:
Returns:
true if object intersects with an area formed by 2 points
Type
Boolean

isCacheDirty(skipCanvas)

Check if cache is dirty 检查缓存是否脏
Parameters:
Name Type Description
skipCanvas Boolean skip canvas checks because this object is painted on parent canvas.跳过画布检查,因为该对象已被绘制 在父画布上。
Source:

isContainedWithinObject(other, absoluteopt, calculateopt) → {Boolean}

Checks if object is fully contained within area of another object 检查对象是否完全包含在另一个对象的区域内
Parameters:
Name Type Attributes Description
other Object Object to test测试对象
absolute Boolean <optional>
use coordinates without viewportTransform使用不带viewportTransform的坐标
calculate Boolean <optional>
use coordinates of current position instead of .oCoords使用当前位置的坐标而不是。ocoordinates
Source:
Returns:
true if object is fully contained within area of another object
Type
Boolean

isContainedWithinRect(pointTL, pointBR, absoluteopt, calculateopt) → {Boolean}

Checks if object is fully contained within area formed by 2 points 检查物体是否完全包含在由2个点组成的区域内
Parameters:
Name Type Attributes Description
pointTL Object top-left point of area区域的左上角点
pointBR Object bottom-right point of area区域的右下点
absolute Boolean <optional>
use coordinates without viewportTransform使用不带viewportTransform的坐标
calculate Boolean <optional>
use coordinates of current position instead of .oCoords使用当前位置的坐标而不是。ocoordinates
Source:
Returns:
true if object is fully contained within area formed by 2 points
Type
Boolean

isControlVisible(controlKey) → {Boolean}

Returns true if the specified control is visible, false otherwise. 如果指定的控件可见则返回true,否则返回false。
Parameters:
Name Type Description
controlKey String The key of the control. Possible values are 'tl', 'tr', 'br', 'bl', 'ml', 'mt', 'mr', 'mb', 'mtr'.控制键。可能的值是“tl”,“tr”,“品牌”,“提单”、“毫升”、“太”,“先生”,“m”,“地铁”。
Source:
Returns:
true if the specified control is visible, false otherwise
Type
Boolean

isOnScreen(calculateopt) → {Boolean}

Checks if object is contained within the canvas with current viewportTransform the check is done stopping at first point that appears on screen 检查对象是否包含在当前viewportTransform的画布中 检查在屏幕上出现的第一个点停止
Parameters:
Name Type Attributes Description
calculate Boolean <optional>
use coordinates of current position instead of .aCoords使用当前位置的坐标而不是。acoord
Source:
Returns:
true if object is fully or partially contained within canvas
Type
Boolean

isPartiallyOnScreen(calculateopt) → {Boolean}

Checks if object is partially contained within the canvas with current viewportTransform 使用当前viewportTransform检查对象是否部分包含在画布中
Parameters:
Name Type Attributes Description
calculate Boolean <optional>
use coordinates of current position instead of .oCoords使用当前位置的坐标而不是。ocoordinates
Source:
Returns:
true if object is partially contained within canvas
Type
Boolean

isType(type) → {Boolean}

Returns true if specified type is identical to the type of an instance 如果指定的类型与实例的类型相同,则返回true
Parameters:
Name Type Description
type String Type to check against要检查的类型
Source:
Returns:
Type
Boolean

moveTo(index) → {fabric.Object}

Moves an object to specified level in stack of drawn objects 将对象移动到绘制对象堆栈中的指定位置
Parameters:
Name Type Description
index Number New position of object物体的新位置
Source:
Returns:
thisArg
Type
fabric.Object

needsItsOwnCache()

When set to `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 当设置为' true '时,强制对象拥有自己的缓存,即使它在一个组中 当您的对象在缓存上以特定方式运行并且总是需要时,可能需要 它自己独立的画布来正确渲染。 创建用于重写 自从1.7.12
Source:
Returns:
Boolean

onDeselect(optionsopt)

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 每次_discardActiveObject或_setActiveObject调用这个回调函数 尝试取消选择此对象。如果函数返回true,则进程被取消
Parameters:
Name Type Attributes Description
options Object <optional>
options sent from the upper functions
Properties
Name Type Attributes Description
e Event <optional>
event if the process is generated by an event如果流程是由事件生成的,则为事件
从上层函数发送的选项 属性 名字 类型 属性 描述 e 事件 如果流程是由事件生成的,则为事件
Source:

onSelect(optionsopt)

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 每次_discardActiveObject或_setActiveObject调用这个回调函数 尝试选择此对象。如果函数返回true,则进程被取消
Parameters:
Name Type Attributes Description
options Object <optional>
options sent from the upper functions
Properties
Name Type Attributes Description
e Event <optional>
event if the process is generated by an event如果流程是由事件生成的,则为事件
从上层函数发送的选项 属性 名字 类型 属性 描述 e 事件 如果流程是由事件生成的,则为事件
Source:

render(ctx)

Renders an object on a specified context 在指定上下文上呈现对象
Parameters:
Name Type Description
ctx CanvasRenderingContext2D Context to render on要渲染的上下文
Source:

rotate(angle) → {fabric.Object}

Sets "angle" of an instance with centered rotation 以居中旋转方式设置实例的“角度”
Parameters:
Name Type Description
angle Number Angle value (in degrees)角度值(以度为单位)
Source:
Returns:
thisArg
Type
fabric.Object

saveState(optionsopt) → {fabric.Object}

Saves state of an object 保存对象的状态
Parameters:
Name Type Attributes Description
options Object <optional>
Object with additional `stateProperties` array to include when saving state对象,在保存状态时要包含附加的' stateProperties '数组
Source:
Returns:
thisArg
Type
fabric.Object

scale(value) → {fabric.Object}

Scales an object (equally by x and y) 缩放对象(等量缩放x和y)
Parameters:
Name Type Description
value Number Scale factor比例因子
Source:
Returns:
thisArg
Type
fabric.Object

scaleToHeight(value, absolute) → {fabric.Object}

Scales an object to a given height, with respect to bounding box (scaling by x/y equally) 将对象缩放到给定高度,相对于边界框(等量缩放x/y)
Parameters:
Name Type Description
value Number New height value新高度值
absolute Boolean ignore viewport忽略视窗
Source:
Returns:
thisArg
Type
fabric.Object

scaleToWidth(value, absolute) → {fabric.Object}

Scales an object to a given width, with respect to bounding box (scaling by x/y equally) 将一个对象缩放到给定的宽度,相对于边界框(等量缩放x/y)
Parameters:
Name Type Description
value Number New width value新的宽度值
absolute Boolean ignore viewport忽略视窗
Source:
Returns:
thisArg
Type
fabric.Object

sendBackwards(intersectingopt) → {fabric.Object}

Moves an object down in stack of drawn objects 在绘制的对象堆栈中向下移动一个对象
Parameters:
Name Type Attributes Description
intersecting Boolean <optional>
If `true`, send object behind next lower intersecting object如果为true,则将对象发送到下一个较低相交对象的后面
Source:
Returns:
thisArg
Type
fabric.Object

sendToBack() → {fabric.Object}

Moves an object to the bottom of the stack of drawn objects 将一个对象移动到绘制对象堆栈的底部
Source:
Returns:
thisArg
Type
fabric.Object

setControlsVisibility(optionsopt) → {fabric.Object}

Sets the visibility state of object controls. 设置对象控件的可见性状态。
Parameters:
Name Type Attributes Description
options Object <optional>
Options object
Properties
Name Type Attributes Description
bl Boolean <optional>
true to enable the bottom-left control, false to disable itTrue为启用左下角控件,false为禁用它
br Boolean <optional>
true to enable the bottom-right control, false to disable itTrue为启用右下角控件,false为禁用它
mb Boolean <optional>
true to enable the middle-bottom control, false to disable itTrue为启用中底控件,false为禁用它
ml Boolean <optional>
true to enable the middle-left control, false to disable itTrue为启用左中控件,false为禁用它
mr Boolean <optional>
true to enable the middle-right control, false to disable itTrue为启用中右控件,false为禁用它
mt Boolean <optional>
true to enable the middle-top control, false to disable itTrue为启用中顶控件,false为禁用它
tl Boolean <optional>
true to enable the top-left control, false to disable itTrue为启用左上角控件,false为禁用它
tr Boolean <optional>
true to enable the top-right control, false to disable itTrue为启用右上方控件,false为禁用它
mtr Boolean <optional>
true to enable the middle-top-rotate control, false to disable itTrue为启用中顶旋转控件,false为禁用该控件
选择对象 属性 名字 类型 属性 描述 提单 布尔 True为启用左下角控件,false为禁用它 br 布尔 True为启用右下角控件,false为禁用它 mb 布尔 True为启用中底控件,false为禁用它 毫升 布尔 True为启用左中控件,false为禁用它 先生 布尔 True为启用中右控件,false为禁用它 太 布尔 True为启用中顶控件,false为禁用它 tl 布尔 True为启用左上角控件,false为禁用它 tr 布尔 True为启用右上方控件,false为禁用它 地铁 布尔 True为启用中顶旋转控件,false为禁用该控件
Source:
Returns:
thisArg
Type
fabric.Object

setControlVisible(controlKey, visible) → {fabric.Object}

Sets the visibility of the specified control. 设置指定控件的可见性。
Parameters:
Name Type Description
controlKey String The key of the control. Possible values are 'tl', 'tr', 'br', 'bl', 'ml', 'mt', 'mr', 'mb', 'mtr'.控制键。可能的值是“tl”,“tr”,“品牌”,“提单”、“毫升”、“太”,“先生”,“m”,“地铁”。
visible Boolean true to set the specified control visible, false otherwiseTrue表示将指定的控件设置为可见,否则为false
Source:
Returns:
thisArg
Type
fabric.Object

setCoords(skipCornersopt) → {fabric.Object}

Sets corner and controls position coordinates based on current angle, width and height, left and top. oCoords are used to find the corners aCoords are used to quickly find an object on the canvas lineCoords are used to quickly find object during pointer events. See https://github.com/fabricjs/fabric.js/wiki/When-to-call-setCoords and http://fabricjs.com/fabric-gotchas 根据当前角度、宽度和高度、左侧和顶部设置角和控制位置坐标。 弦是用来找角的 绳索用于快速找到画布上的对象 linecoord用于在指针事件期间快速查找对象。 参见https://github.com/fabricjs/fabric.js/wiki/When-to-call-setCoords和http://fabricjs.com/fabric-gotchas
Parameters:
Name Type Attributes Description
skipCorners Boolean <optional>
skip calculation of oCoords.跳过ocord的计算。
Source:
Returns:
thisArg
Type
fabric.Object

setOnGroup()

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. 这个回调函数每次由对象的父组调用 对组上的非委托属性进行更改的时间。它被传递了密钥 值作为参数。不添加此函数的签名以避免 Travis构建关于未使用变量的错误。
Source:

setOptions(optionsopt)

Sets object's properties from options 从选项设置对象的属性
Parameters:
Name Type Attributes Description
options Object <optional>
Options object选择对象
Source:

setPositionByOrigin(pos, originX, originY) → {void}

Sets the position of the object taking into consideration the object's origin 根据对象的原点设置对象的位置
Parameters:
Name Type Description
pos fabric.Point The new position of the object对象的新位置
originX String Horizontal origin: 'left', 'center' or 'right'水平原点:“左”、“中”或“右”
originY String Vertical origin: 'top', 'center' or 'bottom'垂直原点:'top', 'center'或'bottom'
Source:
Returns:
Type
void

setupState(optionsopt) → {fabric.Object}

Setups state of an object 设置对象的状态
Parameters:
Name Type Attributes Description
options Object <optional>
Object with additional `stateProperties` array to include when saving state对象,在保存状态时要包含附加的' stateProperties '数组
Source:
Returns:
thisArg
Type
fabric.Object

shouldCache() → {Boolean}

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. None of the fabric classes requires it. 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. 决定对象是否应该缓存。创建自己的缓存级别 objectCaching是一个全局标志,胜过一切 当对象绘制方法需要时,应该使用needsItsOwnCache 缓存步骤。没有一个fabric类需要它。 通常不缓存组中的对象,因为外部的组被缓存。 读取为:缓存,如果需要,或者如果功能已启用,但我们还没有缓存。
Source:
Returns:
Type
Boolean

straighten() → {fabric.Object}

Straightens an object (rotating it from current angle to one of 0, 90, 180, 270, etc. depending on which is closer) 将物体拉直(将其从当前角度旋转到0,90,180,270等中的一个,取决于哪个更接近)
Source:
Returns:
thisArg
Type
fabric.Object

toCanvasElement(options) → {HTMLCanvasElement}

Converts an object into a HTMLCanvas element 将一个对象转换为一个HTMLCanvas元素
Parameters:
Name Type Description
options Object Options object
Properties
Name Type Attributes Default Description
multiplier Number <optional>
1 Multiplier to scale by乘数乘以
left Number <optional>
Cropping left offset. Introduced in v1.2.14裁剪左偏移。在v1.2.14中引入
top Number <optional>
Cropping top offset. Introduced in v1.2.14裁剪顶部偏移。在v1.2.14中引入
width Number <optional>
Cropping width. Introduced in v1.2.14裁剪宽度。在v1.2.14中引入
height Number <optional>
Cropping height. Introduced in v1.2.14种植的高度。在v1.2.14中引入
enableRetinaScaling Boolean <optional>
Enable retina scaling for clone image. Introduce in 1.6.4启用视网膜缩放克隆图像。1.6.4引入
withoutTransform Boolean <optional>
Remove current object transform ( no scale , no angle, no flip, no skew ). Introduced in 2.3.4移除当前对象变换(无缩放、无角度、无翻转、无倾斜)。在2.3.4中引入
withoutShadow Boolean <optional>
Remove current object shadow. Introduced in 2.4.2移除当前对象阴影。2.4.2引入
选择对象 属性 名字 类型 属性 默认的 描述 乘数 数量 1 乘数乘以 左 数量 裁剪左偏移。在v1.2.14中引入 前 数量 裁剪顶部偏移。在v1.2.14中引入 宽度 数量 裁剪宽度。在v1.2.14中引入 高度 数量 种植的高度。在v1.2.14中引入 enableRetinaScaling 布尔 启用视网膜缩放克隆图像。1.6.4引入 withoutTransform 布尔 移除当前对象变换(无缩放、无角度、无翻转、无倾斜)。在2.3.4中引入 withoutShadow 布尔 移除当前对象阴影。2.4.2引入
Source:
Returns:
Returns DOM element with the fabric.Object
Type
HTMLCanvasElement

toClipPathSVG(reviveropt) → {String}

Returns svg clipPath representation of an instance 返回实例的svg clipPath表示
Parameters:
Name Type Attributes Description
reviver function <optional>
Method for further parsing of svg representation.进一步解析svg表示的方法。
Source:
Returns:
svg representation of an instance
Type
String

toDatalessObject(propertiesToIncludeopt) → {Object}

Returns (dataless) object representation of an instance 返回实例的(无数据)对象表示
Parameters:
Name Type Attributes Description
propertiesToInclude Array <optional>
Any properties that you might want to additionally include in the output您可能希望在输出中额外包含的任何属性
Source:
Returns:
Object representation of an instance
Type
Object

toDataURL(options) → {String}

Converts an object into a data-url-like string 将对象转换为类似data-url的字符串
Parameters:
Name Type Description
options Object Options object
Properties
Name Type Attributes Default Description
format String <optional>
png The format of the output image. Either "jpeg" or "png"输出图像的格式。jpeg或png格式
quality Number <optional>
1 Quality level (0..1). Only used for jpeg.质量等级(0..1)。仅用于jpeg。
multiplier Number <optional>
1 Multiplier to scale by乘数乘以
left Number <optional>
Cropping left offset. Introduced in v1.2.14裁剪左偏移。在v1.2.14中引入
top Number <optional>
Cropping top offset. Introduced in v1.2.14裁剪顶部偏移。在v1.2.14中引入
width Number <optional>
Cropping width. Introduced in v1.2.14裁剪宽度。在v1.2.14中引入
height Number <optional>
Cropping height. Introduced in v1.2.14种植的高度。在v1.2.14中引入
enableRetinaScaling Boolean <optional>
Enable retina scaling for clone image. Introduce in 1.6.4启用视网膜缩放克隆图像。1.6.4引入
withoutTransform Boolean <optional>
Remove current object transform ( no scale , no angle, no flip, no skew ). Introduced in 2.3.4移除当前对象变换(无缩放、无角度、无翻转、无倾斜)。在2.3.4中引入
withoutShadow Boolean <optional>
Remove current object shadow. Introduced in 2.4.2移除当前对象阴影。2.4.2引入
选择对象 属性 名字 类型 属性 默认的 描述 格式 字符串 png 输出图像的格式。jpeg或png格式 质量 数量 1 质量等级(0..1)。仅用于jpeg。 乘数 数量 1 乘数乘以 左 数量 裁剪左偏移。在v1.2.14中引入 前 数量 裁剪顶部偏移。在v1.2.14中引入 宽度 数量 裁剪宽度。在v1.2.14中引入 高度 数量 种植的高度。在v1.2.14中引入 enableRetinaScaling 布尔 启用视网膜缩放克隆图像。1.6.4引入 withoutTransform 布尔 移除当前对象变换(无缩放、无角度、无翻转、无倾斜)。在2.3.4中引入 withoutShadow 布尔 移除当前对象阴影。2.4.2引入
Source:
Returns:
Returns a data: URL containing a representation of the object in the format specified by options.format
Type
String

toJSON(propertiesToIncludeopt) → {Object}

Returns a JSON representation of an instance 返回实例的JSON表示形式
Parameters:
Name Type Attributes Description
propertiesToInclude Array <optional>
Any properties that you might want to additionally include in the output您可能希望在输出中额外包含的任何属性
Source:
Returns:
JSON
Type
Object

toLocalPoint(point, originX, originY) → {fabric.Point}

Returns the point in local coordinates 以本地坐标返回点
Parameters:
Name Type Description
point fabric.Point The point relative to the global coordinate system相对于全球坐标系的点
originX String Horizontal origin: 'left', 'center' or 'right'水平原点:“左”、“中”或“右”
originY String Vertical origin: 'top', 'center' or 'bottom'垂直原点:'top', 'center'或'bottom'
Source:
Returns:
Type
fabric.Point

toObject(propertiesToIncludeopt) → {Object}

Returns an object representation of an instance 返回实例的对象表示形式
Parameters:
Name Type Attributes Description
propertiesToInclude Array <optional>
Any properties that you might want to additionally include in the output您可能希望在输出中额外包含的任何属性
Source:
Returns:
Object representation of an instance
Type
Object

toString() → {String}

Returns a string representation of an instance 返回实例的字符串表示形式
Source:
Returns:
Type
String

toSVG(reviveropt) → {String}

Returns svg representation of an instance 返回实例的svg表示形式
Parameters:
Name Type Attributes Description
reviver function <optional>
Method for further parsing of svg representation.进一步解析svg表示的方法。
Source:
Returns:
svg representation of an instance
Type
String

transform(ctx)

Transforms context when rendering an object 在呈现对象时转换上下文
Parameters:
Name Type Description
ctx CanvasRenderingContext2D Context上下文
Source:

translateToCenterPoint(point, originX, originY) → {fabric.Point}

Translates the coordinates from origin to center coordinates (based on the object's dimensions) 将坐标从原点转换为中心坐标(基于对象的尺寸)
Parameters:
Name Type Description
point fabric.Point The point which corresponds to the originX and originY params对应于originX和originY参数的点
originX String Horizontal origin: 'left', 'center' or 'right'水平原点:“左”、“中”或“右”
originY String Vertical origin: 'top', 'center' or 'bottom'垂直原点:'top', 'center'或'bottom'
Source:
Returns:
Type
fabric.Point

translateToGivenOrigin(point, fromOriginX, fromOriginY, toOriginX, toOriginY) → {fabric.Point}

Translates the coordinates from a set of origin to another (based on the object's dimensions) 将坐标从一组原点转换为另一组原点(基于对象的尺寸)
Parameters:
Name Type Description
point fabric.Point The point which corresponds to the originX and originY params对应于originX和originY参数的点
fromOriginX String Horizontal origin: 'left', 'center' or 'right'水平原点:“左”、“中”或“右”
fromOriginY String Vertical origin: 'top', 'center' or 'bottom'垂直原点:'top', 'center'或'bottom'
toOriginX String Horizontal origin: 'left', 'center' or 'right'水平原点:“左”、“中”或“右”
toOriginY String Vertical origin: 'top', 'center' or 'bottom'垂直原点:'top', 'center'或'bottom'
Source:
Returns:
Type
fabric.Point

translateToOriginPoint(center, originX, originY) → {fabric.Point}

Translates the coordinates from center to origin coordinates (based on the object's dimensions) 将坐标从中心坐标转换为原点坐标(基于对象的尺寸)
Parameters:
Name Type Description
center fabric.Point The point which corresponds to center of the object与物体中心相对应的点
originX String Horizontal origin: 'left', 'center' or 'right'水平原点:“左”、“中”或“右”
originY String Vertical origin: 'top', 'center' or 'bottom'垂直原点:'top', 'center'或'bottom'
Source:
Returns:
Type
fabric.Point

viewportCenter() → {fabric.Object}

Centers object on current viewport of canvas to which it was added last. You might need to call `setCoords` on an object after centering, to update controls area. 将对象居中于最后添加到的画布的当前视口中。 你可能需要在定心之后在一个对象上调用setcoord来更新控件区域。
Source:
Returns:
thisArg
Type
fabric.Object

viewportCenterH() → {fabric.Object}

Centers object horizontally on current viewport of canvas to which it was added last. You might need to call `setCoords` on an object after centering, to update controls area. 将对象水平居中于最后添加到的画布的当前视口中。 你可能需要在定心之后在一个对象上调用setcoord来更新控件区域。
Source:
Returns:
thisArg
Type
fabric.Object

viewportCenterV() → {fabric.Object}

Centers object vertically on current viewport of canvas to which it was added last. You might need to call `setCoords` on an object after centering, to update controls area. 将对象垂直居中于它最后添加到的画布的当前视口中。 你可能需要在定心之后在一个对象上调用setcoord来更新控件区域。
Source:
Returns:
thisArg
Type
fabric.Object

willDrawShadow() → {Boolean}

Check if this object or a child object will cast a shadow used by Group.shouldCache to know if child has a shadow recursively 检查此对象或子对象是否会投射阴影 组使用。shouldCache递归地知道子节点是否有影子
Source:
Returns:
Type
Boolean

自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习

京ICP备14009008号@版权所有www.zixuephp.com

网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com