#Node Methods

Programatically control a node with the below methods.

#move

move a node by x, y coordinates

arguments


    node.move({
        x: 30,
        y: 20,
        dur: 500
    });

Name	Type	Description
`x`	integer	Relative number of px to move the node on x axis
`y`	integer	Relative number of px to move the node on y axis
`dur`	intger	The milliseconds for animating the move. Set to 0 to move instantly.

returns

null

#toFront

move a node to front on the z axis

arguments


    node.toFront();

none

returns

null

#toBack

move a node to back on the z axis

arguments


    node.toBack();

none

returns

null

#hide

hide the node

arguments


    node.hide();

none

returns

null

#show

show the node

arguments


    node.show();

none

returns

null

#toggleFilters

show or hide the node effect (dropshadow, etc)

arguments


    node.toggleFilters(blnHide);

Name	Type	Description
`blnHide`	boolean	Set to true ot hide the filter effect

returns

null

#spin

Apply a perpetual spin effect to a node

arguments


    node.spin({
        angle: 280,
        duration: 500
    });

Name	Type	Description
`angle`	integer	The angle to spin the node
`duration`	integer	Milliseconds to take for each spin animation

returns

null

#zoom

Zoom in on the node

arguments


    node.zoom(zoomPercent, duration, cb);

Name	Type	Description
`zoomPercent`	integer	The zoom percent
`duration`	integer	Milliseconds to take for the zoom
`cb`	function	Callback once the zoom completes

returns

null

#position

Position the node

arguments


    node.position(location, cb, easing, dur);

Name	Type	Description
`location`	string	Position on the slate to put this node. Options are `lowerright`, `lowerleft`, `upperright`, `upperleft` and `center`.
`cb`	function	Callback once the position completes
`easing`	function	The easing options
`dur`	function	The milliseconds in which to animate the position

returns

null

#disable

Optionally set node.options.isLocked = true prior to making this disable call to enable lock icons that the user can programmatically click to re-enable the node.

Disables the node from any interaction

arguments


    node.disable();

None

returns

null

#enable

Enable the node for user interaction

arguments


    node.enable();

None

returns

null

#colorPicker.set

Set the background color and opacity for the node

arguments


    node.colorPicker.set({
        color: '#333',
        opacity: 1.0
    });

Name	Type	Description
`color`	string	The hex color for the node. Gradients can also be defined: `90-#031634-#2D579A` (angle-start_hex-end_hex)
`opacity`	integer	the opacity percentage (0.0 - 1.0) for the node color

returns

null

#customShapes.set

Set the node to a custom svg path

arguments


    node.customShapes.set(path, width, height, sendCollab);

Name	Type	Description
`path`	string	The custom svg path to attach to the node (e.g., `M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z`)
`width`	integer	The width of the shape in px
`height`	integer	The height of the shape in px
`sendCollab`	boolean	Set to false to NOT send the collaboration data, defaults to true

returns

null

#editor.set

Set the node to a custom svg path

arguments


    node.editor.set(text, fontSize, fontColor, fontOpacity, textXAlign, textYAlign);

Name	Type	Description
`text`	string	The text to go in the node. Include appropriate `\n` line breaks where necessary
`fontSize`	integer	The width of the shape in px
`fontColor`	string	The hex color of the text (`#333`)
`fontOpacity`	integer	The opacity percentage of the text (0.0 - 1.0)
`textXAlign`	string	Text horizontal align (`middle`, `left`, `right`)
`textYAlign`	string	Text vertical align (`middle`, `top`, `bottom`)

returns

null

#images.set

Set an image to the background of the node

arguments


    node.images.set(img, width, height);

Name	Type	Description
`image`	string	The img src url (e.g., `https://e.com/i.png`)
`width`	integer	The width of the image (used for proportionally resizing)
`height`	integer	The height of the image (used for proportionally resizing)

returns

null

#links.set

Set a link on the node

arguments


    node.links.set({
        type: 'url|currentSlate',
        data: 'https://slatebox.com|other_node_id'
    }, blnSendCollab);

Name	Type	Description
`opts.type`	string	The type of link, either `url` (links to external site) or `currentSlate` (links to another node on the same slate).
`opts.data`	string	The link data (either the url or the other node's `id`)
`blnSendCollab`	boolean	Boolean as to whether to send the collab data

returns

null

#links.unset

Remove a link from the node

arguments


    node.links.unset(blnSendCollab);

Name	Type	Description
`blnSendCollab`	boolean	Boolean as to whether to send the collab data

returns

null

#resize.set

Resize a node

arguments


    node.resize.set(width, height);

Name	Type	Description
`width`	integer	Width in px to resize the node
`height`	integer	Height in px to resize the node

returns

null

#rotate.set

Rotate a node

arguments


    node.rotate.set(rotationAngle);

Name	Type	Description
`rotationAngle`	integer	The rotation angle (0-360) to apply

returns

null

#Node Methods

#move

#toFront

#toBack

#hide

#show

#toggleFilters

#spin

#zoom

#position

#disable

#enable

#colorPicker.set

#customShapes.set

#editor.set

#images.set

#links.set

#links.unset

#resize.set

#rotate.set

Contents