Class Index | File Index

Classes


Class fabric.Element

fabric.Element
Defined in: element.class.js.

Class Summary
Constructor Attributes Constructor Name and Description
 
fabric.Element(el, options)
Field Summary
Field Attributes Field Name and Description
<static>  
fabric.Element.ATTRIBUTE_NAMES
 
<constant>  
<constant>  
<static>  
fabric.Element.EMPTY_JSON
 
 
 
 
 
 
 
Method Summary
Method Attributes Method Name and Description
 
add()
Adds objects to canvas, then renders canvas; Objects should be instances of (or inherit from) fabric.Object
 
bringForward(object)
Moves an object one level up in stack of drawn objects
 
bringToFront(object)
Moves an object to the top of the stack of drawn objects
 
Calculates canvas element offset relative to the document This method is also attached as "resize" event handler of window
 
centerObjectH(object)
Centers object horizontally.
 
centerObjectV(object)
Centers object vertically.
 
Clears all contexts (background, main, top) of an instance
 
clearContext(context)
Clears specified context of canvas element
 
clone(callback)
Clones canvas instance
 
Returns number representation of an instance complexity
 
containsPoint(e, target)
Applies one implementation of 'point inside polygon' algorithm
 
Deactivates all objects by calling their setActive(false)
 
Deactivates all objects and dispatches appropriate events
 
Clears a canvas element and removes all event handlers.
 
findTarget(e, skipGroup)
Method that determines what object we are clicking on
 
fxCenterObjectH(object, callbacks)
Centers object horizontally with animation.
 
fxCenterObjectV(object, callbacks)
Centers object vertically with animation.
 
fxRemove(object, callback)
Same as `fabric.Element#remove` but animated
 
Same as `fabric.Element#straightenObject`, but animated
 
Returns currently active group
 
Returns currently active object
 
Returns coordinates of a center of canvas.
 
Returns topmost canvas context
 
Returns <canvas> element corresponding to this instance
 
Returns canvas height
 
Returns an array of objects this instance has
 
Returns pointer coordinates relative to canvas.
 
Returns canvas width
 
insertAt(object, index)
Inserts an object to canvas at specified index and renders canvas.
 
Returns true if canvas contains no objects
 
item(index)
Returns object at specified index
 
loadFromDatalessJSON(json, callback)
Populates canvas with data from the specified dataless JSON JSON format must conform to the one of `fabric.Element#toDatalessJSON`
 
loadFromJSON(json, callback)
Populates canvas with data from the specified JSON JSON format must conform to the one of `fabric.Element#toJSON`
 
loadImageFromURL(url, callback)
Loads an image from URL
 
loadSVGFromURL(url, callback)
Takes url corresponding to an SVG document, and parses it to a set of objects
 
Callback; invoked right before object is about to be scaled/rotated
 
Callback; invoked on every redraw of canvas and is being passed a number indicating current fps
 
remove(object)
Removes an object from canvas and returns it
 
Removes currently active group
 
Removes currently active object
 
renderAll(allOnTop)
Renders both the top canvas and the secondary container canvas.
 
Method to render only the top canvas.
 
sendBackwards(object)
Moves an object one level down in stack of drawn objects
 
sendToBack(object)
Moves an object to the bottom of the stack of drawn objects
 
Sets active group to a speicified one
 
Sets given object as active
 
setDimensions(dimensions)
Sets dimensions (width, height) of this canvas instance
 
setHeight(height)
Sets height of this canvas instance
 
setOverlayImage(url, callback)
Sets overlay image for this canvas
 
setWidth(width)
Sets width of this canvas instance
 
Straightens object, then rerenders canvas
<static>  
fabric.Element.supports(methodName)
Provides a way to check support of some of the canvas methods (either those of HTMLCanvasElement itself, or rendering context)
 
Returs dataless JSON representation of canvas
 
Returns dataless object representation of canvas
 
toDataURL(format)
Exports canvas element to a dataurl image.
 
toDataURLWithMultiplier(format, multiplier)
Exports canvas element to a dataurl image (allowing to change image size via multiplier).
<static>  
fabric.Element.toGrayscale(canvasEl)
Takes <canvas> element and transforms its data in such way that it becomes grayscale
 
Returs JSON representation of canvas
 
Returns object representation of canvas
 
Returns a string representation of an instance
Class Detail
fabric.Element(el, options)
Parameters:
{HTMLElement | String} el
<canvas> element to initialize instance on
{Object} options Optional
Options object
Field Detail
<static> fabric.Element.ATTRIBUTE_NAMES

Defined in: line.class.js.
See:
http://www.w3.org/TR/SVG/shapes.html#LineElement

{String} backgroundColor

<constant> {Number} CANVAS_HEIGHT

<constant> {Number} CANVAS_WIDTH

<static> {String} fabric.Element.EMPTY_JSON

{String} freeDrawingColor

{Number} freeDrawingLineWidth

{Boolean} includeDefaultValues

{String} selectionBorderColor

{String} selectionColor

{Number} selectionLineWidth

{Boolean} shouldCacheImages
Method Detail
{fabric.Element} add()
Adds objects to canvas, then renders canvas; Objects should be instances of (or inherit from) fabric.Object
Returns:
{fabric.Element} thisArg

{fabric.Element} bringForward(object)
Moves an object one level up in stack of drawn objects
Parameters:
object
{fabric.Object} Object to send
Returns:
{fabric.Element} thisArg

{fabric.Element} bringToFront(object)
Moves an object to the top of the stack of drawn objects
Parameters:
object
{fabric.Object} Object to send
Returns:
{fabric.Element} thisArg

{fabric.Element} calcOffset()
Calculates canvas element offset relative to the document This method is also attached as "resize" event handler of window
Returns:
{fabric.Element} instance

{fabric.Element} centerObjectH(object)
Centers object horizontally.
Parameters:
{fabric.Object} object
Object to center
Returns:
{fabric.Element} thisArg

{fabric.Element} centerObjectV(object)
Centers object vertically.
Parameters:
{fabric.Object} object
Object to center
Returns:
{fabric.Element} thisArg

{fabric.Element} clear()
Clears all contexts (background, main, top) of an instance
Returns:
{fabric.Element} thisArg

{fabric.Element} clearContext(context)
Clears specified context of canvas element
Parameters:
context
{Object} ctx context to clear
Returns:
{fabric.Element} thisArg

{fabric.Element} clone(callback)
Clones canvas instance
Parameters:
{Object} callback Optional
Expects `onBeforeClone` and `onAfterClone` functions
Returns:
{fabric.Element} Clone of this instance

{Number} complexity()
Returns number representation of an instance complexity
Returns:
{Number} complexity

{Boolean} containsPoint(e, target)
Applies one implementation of 'point inside polygon' algorithm
Parameters:
e
{ Event } event object
target
{ fabric.Object } object to test against
Returns:
{Boolean} true if point contains within area of given object

{fabric.Element} deactivateAll()
Deactivates all objects by calling their setActive(false)
Returns:
{fabric.Element} thisArg

{fabric.Element} deactivateAllWithDispatch()
Deactivates all objects and dispatches appropriate events
Returns:
{fabric.Element} thisArg

{fabric.Element} dispose()
Clears a canvas element and removes all event handlers.
Returns:
{fabric.Element} thisArg

findTarget(e, skipGroup)
Method that determines what object we are clicking on
Parameters:
{Event} e
mouse event
{Boolean} skipGroup
when true, group is skipped and only objects are traversed through

{fabric.Element} fxCenterObjectH(object, callbacks)
Centers object horizontally with animation.
Parameters:
{fabric.Object} object
Object to center
{Object} callbacks Optional
Callbacks object with optional "onComplete" and/or "onChange" properties
Returns:
{fabric.Element} thisArg

{fabric.Element} fxCenterObjectV(object, callbacks)
Centers object vertically with animation.
Parameters:
{fabric.Object} object
Object to center
{Object} callbacks Optional
Callbacks object with optional "onComplete" and/or "onChange" properties
Returns:
{fabric.Element} thisArg

{fabric.Element} fxRemove(object, callback)
Same as `fabric.Element#remove` but animated
Parameters:
{fabric.Object} object
Object to remove
{Function} callback
Callback, invoked on effect completion
Returns:
{fabric.Element} thisArg

{fabric.Element} fxStraightenObject(object)
Same as `fabric.Element#straightenObject`, but animated
Parameters:
{fabric.Object} object
Object to straighten
Returns:
{fabric.Element} thisArg

{fabric.Group} getActiveGroup()
Returns currently active group
Returns:
{fabric.Group} Current group

{fabric.Object} getActiveObject()
Returns currently active object
Returns:
{fabric.Object} active object

{Object} getCenter()
Returns coordinates of a center of canvas. Returned value is an object with top and left properties
Returns:
{Object} object with "top" and "left" number values

{CanvasRenderingContext2D} getContext()
Returns topmost canvas context
Returns:
{CanvasRenderingContext2D}

{HTMLCanvasElement} getElement()
Returns <canvas> element corresponding to this instance
Returns:
{HTMLCanvasElement}

{Number} getHeight()
Returns canvas height
Returns:
{Number}

{Array} getObjects()
Returns an array of objects this instance has
Returns:
{Array}

{Object} getPointer(e)
Returns pointer coordinates relative to canvas.
Parameters:
e
Returns:
{Object} object with "x" and "y" number values

{Number} getWidth()
Returns canvas width
Returns:
{Number}

{fabric.Element} insertAt(object, index)
Inserts an object to canvas at specified index and renders canvas. An object should be an instance of (or inherit from) fabric.Object
Parameters:
object
{Object} Object to insert
index
{Number} index to insert object at
Returns:
{fabric.Element} instance

{Boolean} isEmpty()
Returns true if canvas contains no objects
Returns:
{Boolean} true if canvas is empty

{fabric.Object} item(index)
Returns object at specified index
Parameters:
{Number} index
Returns:
{fabric.Object}

{fabric.Element} loadFromDatalessJSON(json, callback)
Populates canvas with data from the specified dataless JSON JSON format must conform to the one of `fabric.Element#toDatalessJSON`
Parameters:
{String} json
JSON string
{Function} callback
Callback, invoked when json is parsed and corresponding objects (e.g: fabric.Image) are initialized
Returns:
{fabric.Element} instance

{fabric.Element} loadFromJSON(json, callback)
Populates canvas with data from the specified JSON JSON format must conform to the one of `fabric.Element#toJSON`
Parameters:
{String} json
JSON string
{Function} callback
Callback, invoked when json is parsed and corresponding objects (e.g: fabric.Image) are initialized
Returns:
{fabric.Element} instance

loadImageFromURL(url, callback)
Loads an image from URL
Parameters:
url
{String} url of image to load
callback
{Function} calback, invoked when image is loaded

loadSVGFromURL(url, callback)
Takes url corresponding to an SVG document, and parses it to a set of objects
Parameters:
{String} url
{Function} callback

onBeforeScaleRotate(target)
Callback; invoked right before object is about to be scaled/rotated
Parameters:
{fabric.Object} target
Object that's about to be scaled/rotated

onFpsUpdate(fps)
Callback; invoked on every redraw of canvas and is being passed a number indicating current fps
Parameters:
{Number} fps

{Object} remove(object)
Removes an object from canvas and returns it
Parameters:
object
{Object} Object to remove
Returns:
{Object} removed object

{fabric.Element} removeActiveGroup()
Removes currently active group
Returns:
{fabric.Element} thisArg

{fabric.Element} removeActiveObject()
Removes currently active object
Returns:
{fabric.Element} thisArg

{fabric.Element} renderAll(allOnTop)
Renders both the top canvas and the secondary container canvas.
Parameters:
allOnTop
{Boolean} optional Whether we want to force all images to be rendered on the top canvas
Returns:
{fabric.Element} instance

{fabric.Element} renderTop()
Method to render only the top canvas. Also used to render the group selection box.
Returns:
{fabric.Element} thisArg

{fabric.Element} sendBackwards(object)
Moves an object one level down in stack of drawn objects
Parameters:
object
{fabric.Object} Object to send
Returns:
{fabric.Element} thisArg

{fabric.Element} sendToBack(object)
Moves an object to the bottom of the stack of drawn objects
Parameters:
object
{fabric.Object} Object to send to back
Returns:
{fabric.Element} thisArg

{fabric.Element} setActiveGroup(group)
Sets active group to a speicified one
Parameters:
{fabric.Group} group
Group to set as a current one
Returns:
{fabric.Element} thisArg

{fabric.Element} setActiveObject(object)
Sets given object as active
Parameters:
object
{fabric.Object} Object to set as an active one
Returns:
{fabric.Element} thisArg

{fabric.Element} setDimensions(dimensions)
Sets dimensions (width, height) of this canvas instance
Parameters:
{Object} dimensions
Returns:
{fabric.Element} thisArg

{fabric.Element} setHeight(height)
Sets height of this canvas instance
Parameters:
{Number} height
value to set height to
Returns:
{fabric.Element} instance

{fabric.Element} setOverlayImage(url, callback)
Sets overlay image for this canvas
Parameters:
{String} url
url of an image to set background to
{Function} callback
callback to invoke when image is loaded and set as an overlay one
Returns:
{fabric.Element} thisArg

{fabric.Element} setWidth(width)
Sets width of this canvas instance
Parameters:
{Number} width
value to set width to
Returns:
{fabric.Element} instance

{fabric.Element} straightenObject(object)
Straightens object, then rerenders canvas
Parameters:
{fabric.Object} object
Object to straighten
Returns:
{fabric.Element} thisArg

<static> {Boolean | null} fabric.Element.supports(methodName)
Provides a way to check support of some of the canvas methods (either those of HTMLCanvasElement itself, or rendering context)
Parameters:
methodName
{String} Method to check support for; Could be one of "getImageData" or "toDataURL"
Returns:
{Boolean | null} `true` if method is supported (or at least exists), `null` if canvas element or context can not be initialized

{String} toDatalessJSON()
Returs dataless JSON representation of canvas
Returns:
{String} json string

{Object} toDatalessObject()
Returns dataless object representation of canvas
Returns:
{Object}

{String} toDataURL(format)
Exports canvas element to a dataurl image.
Parameters:
{String} format
the format of the output image. Either "jpeg" or "png".
Returns:
{String}

{String} toDataURLWithMultiplier(format, multiplier)
Exports canvas element to a dataurl image (allowing to change image size via multiplier).
Parameters:
{String} format
(png|jpeg)
{Number} multiplier
Returns:
{String}

<static> fabric.Element.toGrayscale(canvasEl)
Takes <canvas> element and transforms its data in such way that it becomes grayscale
Parameters:
{HTMLCanvasElement} canvasEl

{String} toJSON()
Returs JSON representation of canvas
Returns:
{String} json string

{Object} toObject()
Returns object representation of canvas
Returns:
{Object}

{String} toString()
Returns a string representation of an instance
Returns:
{String} string representation of an instance

Documentation generated by JsDoc Toolkit 2.4.0 on Thu Oct 14 2010 21:41:42 GMT-0400 (EDT)