VisualNEO Web

Purpose:

Adds an event to an Object.

Category:

FabricJS

Syntax:

fabAddEvent "containerId" "name" evento funcion

containerId

Select an initializazed Container Object

name

Object name

evento

Event Name

funcion

Function name to call when event fires

Purpose:

Adds common preprogrammed events:

Ctrl-C, Ctrl-V, Ctrl-X and Arrow keys

Category:

FabricJS

Syntax:

fabAddKeyEvents "containerId"

containerId

Select an initializazed Container Object

Purpose:

Animates object's properties

Category:

FabricJS

Syntax:

fabAnimate "containerId" "name" [animation] duration "easing

containerId

Select an initializazed Container Object

name

Object name

animation

Animation description (ie:{left:100,top:100,angle:'+=180'} or CSS object)

duration

Duration in milliseconds

"easing

Easing"

Purpose:

Bring to front to an object selected on canvas or by its name

Category:

FabricJS

Syntax:

fabBringToFront "containerId" "name"

containerId

Select an initializazed Container Object

name

Object name

Purpose:

Centers in canvas an object selected on canvas or by its name

Category:

FabricJS

Syntax:

fabCenterObject "containerId" "name"

containerId

Select an initializazed Container Object

name

Object name

Purpose:

Centers horizontally in canvas an object selected on canvas or by its name

Category:

FabricJS

Syntax:

fabCenterObjectHorinzontal "containerId" "name"

containerId

Select an initializazed Container Object

name

Object name

Purpose:

Centers vertically in canvas an object selected on canvas or by its name

Category:

FabricJS

Syntax:

fabCenterObjectVertical "containerId" "name"

containerId

Select an initializazed Container Object

name

Object name

Purpose:

Clear the canvas

Category:

FabricJS

Syntax:

fabClear "containerId"

containerId

Select an initializazed Container Object

Purpose:

Clone the sleected object

Category:

FabricJS

Syntax:

fabCloneSelectedObject "containerId" "newName"

containerId

Select an initializazed Container Object

newName

Name for the new object

Purpose:

Copy

Category:

FabricJS

Syntax:

fabCopy "containerId"

containerId

Select an initializazed Container Object

Purpose:

Deletes a previously saved local image

Category:

FabricJS

Syntax:

fabDeleteLocal "name"

name

Image name (ie:mydrawing)

Purpose:

Turns on or off the freehand drawing mode.

Category:

FabricJS

Syntax:

fabDrawingMode "containerId" valor "elcolor" elwidth

containerId

Select an initializazed Container Object

valor

Drawing mode (true or false)

elcolor

Line color (ie: #ff0000)

elwidth

Line width

Purpose:

Changes the font family in a Text Object

Category:

FabricJS

Syntax:

fabFontFamily "containerId" "name" "fuente"

containerId

Select an initializazed Container Object

name

Object name

fuente

Font Family

Purpose:

Changes the Font size (in pixels)

Category:

FabricJS

Syntax:

fabFontSize "containerId" "name" size

containerId

Select an initializazed Container Object

name

Object name

size

Font Size

Purpose:

Font style. Possible values: "", "normal", "italic" or "oblique".

Category:

FabricJS

Syntax:

fabFontStyle "containerId" "name" style

containerId

Select an initializazed Container Object

name

Object name

style

Font Style

Purpose:

Font weight (ie: bold, normal)

Category:

FabricJS

Syntax:

fabFontWeight "containerId" "name" weight

containerId

Select an initializazed Container Object

name

Object name

weight

Font Weight

Purpose:

When true, object is fliped horizontally

Category:

FabricJS

Syntax:

fabFlipX "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Object name

valor

FlipX (true or false)

Purpose:

When true, object is fliped vertically

Category:

FabricJS

Syntax:

fabFlipY "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Object name

valor

FlipY (true or false)

Purpose:

Gets an object property value

Category:

FabricJS

Syntax:

fabGetProperty "containerId" "name" "property" [result]

containerId

Select an initializazed Container Object

name

Object name

property

Property name

result

Variable to store the result

Purpose:

Group

Category:

FabricJS

Syntax:

fabGroup "containerId"

containerId

Select an initializazed Container Object

Purpose:

When set to false, object's controlling borders are not rendered

Category:

FabricJS

Syntax:

fabHasBorders "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Object name

valor

Has Borders (true or false)

Purpose:

When set to 'false', object's controls are not displayed and can not be used to manipulate object

Category:

FabricJS

Syntax:

fabHasControls "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Objects name

valor

Has controls (true or false)

Purpose:

Initializes the library on a container object

Category:

FabricJS

Syntax:

fabInitialize "containerId"

containerId

Select a Container Object from your App

Purpose:

Initializes the library on a container Object with Org Chart Capabilities

Category:

FabricJS

Syntax:

fabInitializeOrgChart "containerId"

containerId

Select a Container Object from your App

Purpose:

Initializes the library on a container Object without interactivity layer

Category:

FabricJS

Syntax:

fabInitializeStatic "containerId"

containerId

Select a Container Object from your App

Purpose:

Detect two objects intersection

Category:

FabricJS

Syntax:

fabIntersectsWith [resultado] "name1" "name2"

resultado

Var to store the result

name1

Object 1 name

name2

Object 2 name

Purpose:

Loads an image from a URL

Category:

FabricJS

Syntax:

fabLoadImage "containerId" "name" url x y

containerId

Select an initializazed Container Object

name

Image name

url

Image URL and file name

x

Left position

y

Top position

Purpose:

Load a previously saved JSON data

Category:

FabricJS

Syntax:

fabLoadFromJSON "containerId" "json"

containerId

Select an initializazed Container Object

json

JSON string

Purpose:

Loads a previously saved local image

Category:

FabricJS

Syntax:

fabLoadLocal "containerId" "name"

containerId

Select an initializazed Container Object

name

Image name (ie:mydrawing)

Purpose:

Loads a SVG image from a URL

Category:

FabricJS

Syntax:

fabLoadSVGFromString "containerId" "name" svgstring x y

containerId

Select an initializazed Container Object

name

Image name

svgstring

SVG string

x

Left position

y

Top position

Purpose:

When true, object horizontal movement is locked

Category:

FabricJS

Syntax:

fabLockMovementX "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Objects name

valor

Lock Movement X (true or false)

Purpose:

When true, object vertical movement is locked

Category:

FabricJS

Syntax:

fabLockMovementY "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Objects name

valor

Lock Movement X (true or false)

Purpose:

When true, object rotation is locked

Category:

FabricJS

Syntax:

fabLockRotation "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Objects name

valor

Lock Rotation (true or false)

Purpose:

When true, object scaling is locked

Category:

FabricJS

Syntax:

fabLockScaling "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Objects name

valor

Lock Scaling (true or false)

Purpose:

Add a circle

Category:

FabricJS

Syntax:

fabNewCircle "containerId" "name" x y radius "fill"

containerId

Select an initializazed Container Object

name

Circle name

x

Left position

y

Top position

radius

Circle radius

fill

Fill color. Ex: #ff0000

Purpose:

Adds a line

Category:

FabricJS

Syntax:

fabNewLine "containerId" "name" x1 y1 x2 y2 strokeWidth "strokeColor"

containerId

Select an initializazed Container Object

name

Line name

x1

X1 Left origin position

y1

Y1 Top origin position

x2

X2 Left destination position

y2

Y2 Top destination position

strokeWidth

Stroke Width

strokeColor

Stroke Color ie:#ff0000

Purpose:

Adds a path

Category:

FabricJS

Syntax:

fabNewPath "containerId" "name" "path" x y "fill"

containerId

Select an initializazed Container Object

name

Rectangle Name

path

Path to draw (ie: 'M 0 0 L 200 100 L 170 200 z')

x

Left position

y

Top position

fill

Fill color Ex: #ff0000

Purpose:

Adds a rectangle

Category:

FabricJS

Syntax:

fabNewRect "containerId" "name" x y width height "fill"

containerId

Select an initializazed Container Object

name

Rectangle Name

x

Left position

y

Top position

width

Rectangle width

height

Rectangle Height

fill

Fill color Ex: #ff0000

Purpose:

Adds a new text

Category:

FabricJS

Syntax:

fabNewText "containerId" "name" "texto" x y "fill" "fuente" tamano angulo

containerId

Select an initializazed Container Object

name

Text name

texto

Text to write

x

Left position

y

Top position

fill

Fill color. Ex: #ff0000

fuente

Font Family (ie:Georgia)

tamano

Font Size (ie:20)

angulo

Angle (ie:45)

Purpose:

Adds a new text with background color and padding

Category:

FabricJS

Syntax:

fabNewTextEx "containerId" "name" "texto" x y "fill" "theBackground" thePadding "fuente" tamano angulo

containerId

Select an initialized Container Object

name

Text name

texto

Text to write

x

Left position

y

Top position

fill

Fill color. Ex: #ff0000

theBackground

Background color

thePadding

Padding (number)

fuente

Font Family (ie:Georgia)

tamano

Font Size (ie:20)

angulo

Angle (ie:45)

Purpose:

Adds a new interactive (user editable) text

Category:

FabricJS

Syntax:

fabNewInteractiveText "containerId" "name" "texto" x y "fill" "fuente" tamano angulo

containerId

Select an initializazed Container Object

name

Text name

texto

Text to write

x

Left position

y

Top position

fill

Fill color. Ex: #ff0000

fuente

Font Family (ie:Georgia)

tamano

Font Size (ie:20)

angulo

Angle (ie:45)

Purpose:

Adds a new interactive (user editable) text with background color and padding

Category:

FabricJS

Syntax:

fabNewInteractiveTextEx "containerId" "name" "texto" x y "fill" "theBackground" thePadding "fuente" tamano angulo

containerId

Select an initialized Container Object

name

Text name

texto

Text to write

x

Left position

y

Top position

fill

Fill color. Ex: #ff0000

theBackground

Background color

thePadding

Padding (number)

fuente

Font Family (ie:Georgia)

tamano

Font Size (ie:20)

angulo

Angle (ie:45)

Purpose:

Horizontal origin of transformation of an object (one of "left", "right", "center")

Category:

FabricJS

Syntax:

fabOriginX "containerId" "name" "valor"

containerId

Select an initializazed Container Object

name

Text name

valor

Origin X (left,center,right)

Purpose:

Vertical origin of transformation of an object (one of "top", "bottom", "center")

Category:

FabricJS

Syntax:

fabOriginY "containerId" "name" "valor"

containerId

Select an initializazed Container Object

name

Text name

valor

Origin Y (top,center,bottom)

Purpose:

Pans the canvas to a specific absolute point

Category:

FabricJS

Syntax:

fabPanTo "containerId" x y

containerId

Select an initializazed Container Object

x

X position

y

Y position

Purpose:

Turns On or Off panning with mouse right button

Category:

FabricJS

Syntax:

fabPanning "containerId" valor

containerId

Select an initializazed Container Object

valor

Pan when dragging with mouse right button

Purpose:

Paste

Category:

FabricJS

Syntax:

fabPaste "containerId"

containerId

Select an initializazed Container Object

Purpose:

Pans the canvas by an offset distance in both axis

Category:

FabricJS

Syntax:

fabRelativePan "containerId" offsetX offsetY

containerId

Select an initializazed Container Object

offsetX

X Offset

offsetY

Y Offset

Purpose:

Removes an object selected on canvas or by its name

Category:

FabricJS

Syntax:

fabRemove "containerId" "name"

containerId

Select an initializazed Container Object

name

Object name

Purpose:

Save the canvas as JSON data

Category:

FabricJS

Syntax:

fabSaveAsJSON "containerId" [mivar]

containerId

Select an initializazed Container Object

mivar

Variable to store the result

Purpose:

Saves the canvas as a PNG image file with background transparency

Category:

FabricJS

Syntax:

fabSaveAsPNG "containerId" "fileName"

containerId

Select an initializazed Container Object

fileName

File name (ie: image.png)

Purpose:

Saves the canvas as a JPG image file in a given quality

Category:

FabricJS

Syntax:

fabSaveAsJPG "containerId" "fileName" quality

containerId

Select an initializazed Container Object

fileName

File name (ie: image.png)

quality

Image quality (0.0 to 1.0)

Purpose:

Saves the canvas as Base64 data with background transparency

Category:

FabricJS

Syntax:

fabSaveAsBase64 "containerId" [varName]

containerId

Select an initializazed Container Object

varName

Variable to store Base64 data image

Purpose:

Saves the canvas as a SVG image file into a variable

Category:

FabricJS

Syntax:

fabSaveAsSVG "containerId" [mivar]

containerId

Select an initializazed Container Object

mivar

Variable to store the result

Purpose:

Saves the canvas to the clipboard (Chromium based browsers only with no transparency)

Category:

FabricJS

Syntax:

fabSaveToClipboard "containerId"

containerId

Select an initializazed Container Object

Purpose:

Save a copy on the local system

Category:

FabricJS

Syntax:

fabSaveLocal "containerId" "name"

containerId

Select an initializazed Container Object

name

Image name (ie:mydrawing)

Purpose:

Sets the scale to an object selected on canvas or by its name

Category:

FabricJS

Syntax:

fabScale "containerId" "name" escala

containerId

Select an initializazed Container Object

name

Object name

escala

Scale (ie:0.25)

Purpose:

Saves de image as PDF (needs jsPDF and FileSaver.js libraries to be loaded)

Category:

FabricJS

Syntax:

fabSavePDF "containerId" "name"

containerId

Select an initializazed Container Object

name

PDF file name

Purpose:

Scales an object to a given height, with respect to bounding box (scaling by x/y equally)

Category:

FabricJS

Syntax:

fabScaleToHeight "containerId" "name" altura

containerId

Select an initializazed Container Object

name

Object name

altura

Height

Purpose:

Scales an object to a given width, with respect to bounding box (scaling by x/y equally)

Category:

FabricJS

Syntax:

fabScaleToWidth "containerId" "name" anchura

containerId

Select an initializazed Container Object

name

Object name

anchura

Width

Purpose:

Sets the selectable property of an object

Category:

FabricJS

Syntax:

fabSelectable "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Objects name

valor

Selectable (true or false)

Purpose:

Sends to back to an object selected on canvas or by its name

Category:

FabricJS

Syntax:

fabSendToBack "containerId" "name"

containerId

Select an initializazed Container Object

name

Object name

Purpose:

Sets many properties on one single action

Category:

FabricJS

Syntax:

fabSet "containerId" "name" [objeto]

containerId

Select an initializazed Container Object

name

Object name

objeto

Properties. ie: {top:0,left:10,angle:90} or CSS object

Purpose:

Sets an object active by its name

Category:

FabricJS

Syntax:

fabSetActiveObject "containerId" "name"

containerId

Select an initializazed Container Object

name

Object name (mandatory)

Purpose:

Sets the canvas background color

Category:

FabricJS

Syntax:

fabSetBgColor "containerId" "color"

containerId

Select an initializazed Container Object

color

Color value (ie: #ff0000)

Purpose:

Sets the fill color for any object selected on canvas or by its name

Category:

FabricJS

Syntax:

fabSetFill "containerId" "name" "value"

containerId

Select an initializazed Container Object

name

Name of the object to fill. Left empty for currently selected object

value

Color value (ie: #ff0000)

Purpose:

Sets object's left position

Category:

FabricJS

Syntax:

fabSetLeft "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Object name

valor

Left distance

Purpose:

Sets object's opacity

Category:

FabricJS

Syntax:

fabSetOpacity "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Object name

valor

Opacity value (0-1)

Purpose:

Set any property value

Category:

FabricJS

Syntax:

fabSetProperty "containerId" "name" property "valor"

containerId

Select an initializazed Container Object

name

Object name

property

Property name

valor

Property value

Purpose:

Set a numerical property value

Category:

FabricJS

Syntax:

fabSetNumericalProperty "containerId" "name" property valor

containerId

Select an initializazed Container Object

name

Object name

property

Property name

valor

Property value

Purpose:

When set to false, object's controlling rotating point will not be visible or selectable

Category:

FabricJS

Syntax:

fabRotatingPointPoint "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Objects name

valor

Has Rotating Point (true or false)

Purpose:

Sets a shadow to an object selected on canvas or by its name

Category:

FabricJS

Syntax:

fabSetShadow "containerId" "name" "theColor" despX despY theBlur

containerId

Select an initializazed Container Object

name

Object name

theColor

Shadow color (ie:#000000)

despX

X offset in pixels

despY

Y offset in pixels

theBlur

Blur (ie:10)

Category:

FabricJS

Syntax:

fabSetStrokeColor "containerId" "name" "valor"

containerId

Select an initializazed Container Object

name

Object name

valor

Stroke color (ie:#ff0000)

Purpose:

Set object's strokeWidth

Category:

FabricJS

Syntax:

fabSetStrokeWidth "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Object name

valor

Stroke width

Purpose:

Set text align

Category:

FabricJS

Syntax:

fabSetTextAlign "containerId" "name" "valor"

containerId

Select an initializazed Container Object

name

Object name

valor

left, right, center or justify

Purpose:

Set text backgrounnd color

Category:

FabricJS

Syntax:

fabSetTextBackgroundColor "containerId" "name" "valor"

containerId

Select an initializazed Container Object

name

Object name

valor

Background color (ie:#ff0000)

Purpose:

Set text line height

Category:

FabricJS

Syntax:

fabSetTextLineHeight "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Object name

valor

Line height

Purpose:

Sets object's top position

Category:

FabricJS

Syntax:

fabSetTop "containerId" "name" valor

containerId

Select an initializazed Container Object

name

Object name

valor

Top distance

Purpose:

Sets the Canvas Zoom

Category:

FabricJS

Syntax:

fabSetZoom "containerId" zoom

containerId

Select an initializazed Container Object

zoom

Zoom factor (ie:1.5)

Purpose:

Text alignment. Possible values: "left", "center", "right" or "justify".

Category:

FabricJS

Syntax:

fabTextAlign "containerId" "name" "align"

containerId

Select an initializazed Container Object

name

Object name

align

Alignment.(left,center,right or justify

Purpose:

Toggles a boolean property from true to false or viceversa

Category:

FabricJS

Syntax:

fabToggle "containerId" "name" "valor"

containerId

Select an initializazed Container Object

name

Object name

valor

Boolean property to toggle

Purpose:

Undo last hand drawn path when Drawing Mode is set to true

Category:

FabricJS

Syntax:

fabUndoDraw "containerId"

containerId

Select a Container Object

Purpose:

Ungroup

Category:

FabricJS

Syntax:

fabUngroup "containerId"

containerId

Select an initializazed Container Object

Purpose:

Deactivate all selected objects

Category:

FabricJS

Syntax:

fabUnselect "containerId"

containerId

Select an initializazed Container Object

Purpose:

Zoom the canvas centered in a given point

Category:

FabricJS

Syntax:

fabZoomToPoint "containerId" zoom x y

containerId

Select an initializazed Container Object

zoom

Zoom factor (ie:1.5)

x

X point coordinate

y

Y point coordinate

Purpose:

Loads an image file into the Fabric canvas. You should use this commend inside a File Input object change event.

Category:

FabricJS

Syntax:

fabLoadFile "containerId" "object name"

containerId

Select an initializaed Container object

object name

An optional object name so it can be referenced later

Purpose:

Load an local image file and resize the canvas to its size.

Category:

FabricJS

Syntax:

fabLoadLocalMainImage "containerId" "name"

containerId

Select an initialized Container object

name

Object name (optional)

Purpose:

Load an image from URL and resize the canvas to its size.

Category:

FabricJS

Syntax:

fabLoadMainImage "containerId" "name" "url"

containerId

Select an initialized Container object

name

Object name (optional)

url

Image URL

Purpose:

Set default controls colors and size

Category:

FabricJS

Syntax:

fabSetControls theCornerSize "theBorderColor" "theCornerColor" theTransparency

theCornerSize

Corner size (pixels)

theBorderColor

Border color (ie: #012060)

theCornerColor

Corner color (ie: #012060)

theTransparency

Apply transparency?

Purpose:

Get the canvas width into a variable

Category:

FabricJS

Syntax:

fabGetCanvasWidth "containerId" returnVar

containerId

Select an initialized Container object

returnVar

Variable to store result

Purpose:

Get the canvas height into a variable

Category:

FabricJS

Syntax:

fabGetCanvasHeight "containerId" returnVar

containerId

Select an initialized Container object

returnVar

Variable to store result

Category:

FabricJS

Syntax:

fabNewPolyline "containerId" "name" theArray "fill" strokeWidth "strokeColor"

containerId

Select an initialized Container object

name

Polyline name (optional)

theArray

Array variable with x,y data collection

fill

Fill color (ie: #ff0000)

strokeWidth

Stroke width (ie: 3)

strokeColor

Stroke color (ie: #ff0000)