Class Kinetic.Node

Defined in: kinetic.js.

Class Summary
Constructor Attributes	Constructor Name and Description
	Kinetic.Node(config) Node constructor.

Method Summary
Method Attributes	Method Name and Description
	draggable(isDraggable) enable or disable drag and drop
	getAbsoluteAlpha() get absolute alpha
	getAbsolutePosition() get absolute position relative to stage
	getAbsoluteTransform() get transform of the node while taking into account the transforms of its parents
	getAbsoluteZIndex() get absolute z-index by taking into account all parent and sibling indices
	getAlpha() get alpha.
	getAttrs() get attrs
	getCenterOffset() get center offset
	getDetectionType() get detection type
	getDragBounds() get drag bounds
	getDragConstraint() get drag constraint
	getLayer() get layer associated to node
	getLevel() get node level in node tree
	getName() get name
	getParent() get parent container
	getPosition() get node position relative to container
	getRotation() get rotation in radians
	getRotationDeg() get rotation in degrees
	getScale() get scale
	getStage() get stage associated to node
	getTransform() get transform of the node while not taking into account the transforms of its parents
	getX() get node x position
	getY() get node y position
	getZIndex() get zIndex
	hide() hide node
	isDragging() determine if node is currently in drag and drop mode
	isVisible() determine if shape is visible or not
	listen(listening) listen or don't listen to events
	move(x, y) move node by an amount
	moveDown() move node down
	moveTo(newContainer) move node to another container
	moveToBottom() move node to bottom
	moveToTop() move node to top
	moveUp() move node up
	off(typesStr) remove event bindings from the node.
	on(typesStr, handler) bind events to the node.
	rotate(theta) rotate node by an amount in radians
	rotateDeg(deg) rotate node by an amount in degrees
	setAbsolutePosition(pos) set absolute position relative to stage
	setAlpha(alpha) set alpha.
	setAttrs(config) set attrs
	setCenterOffset(x, y) set center offset
	setDefaultAttrs(confic) set default attrs
	setDetectionType(type) set detection type
	setDragBounds(bounds) set drag bounds
	setDragConstraint(constraint) set drag constraint
	setPosition(point) set node position
	setRotation(theta) set node rotation in radians
	setRotationDeg(deg) set node rotation in degrees
	setScale(scaleX, scaleY) set node scale.
	setX(x) set node x position
	setY(y) set node y position
	setZIndex(zIndex) set zIndex
	show() show node
	transitionTo(config) transition node to another state.

Class Detail

Kinetic.Node(config)

Node constructor. Nodes are entities that can move around and have events bound to them. They are the building blocks of a KineticJS application

Parameters:
{Object} config

Method Detail

draggable(isDraggable)

enable or disable drag and drop

Parameters:
{Boolean} isDraggable

getAbsoluteAlpha()

get absolute alpha

getAbsolutePosition()

get absolute position relative to stage

getAbsoluteTransform()

get transform of the node while taking into account the transforms of its parents

getAbsoluteZIndex()

get absolute z-index by taking into account all parent and sibling indices

getAlpha()

get alpha. Alpha values range from 0 to 1. A node with an alpha of 0 is fully transparent, and a node with an alpha of 1 is fully opaque

getAttrs()

get attrs

getCenterOffset()

get center offset

getDetectionType()

get detection type

getDragBounds()

get drag bounds

getDragConstraint()

get drag constraint

getLayer()

get layer associated to node

getLevel()

get node level in node tree

getName()

get name

getParent()

get parent container

getPosition()

get node position relative to container

getRotation()

get rotation in radians

getRotationDeg()

get rotation in degrees

getScale()

get scale

getStage()

get stage associated to node

getTransform()

get transform of the node while not taking into account the transforms of its parents

getX()

get node x position

getY()

get node y position

getZIndex()

get zIndex

hide()

hide node

isDragging()

determine if node is currently in drag and drop mode

isVisible()

determine if shape is visible or not

listen(listening)

listen or don't listen to events

Parameters:
{Boolean} listening

move(x, y)

move node by an amount

Parameters:
{Number} x
{Number} y

moveDown()

move node down

moveTo(newContainer)

move node to another container

Parameters:
{Container} newContainer

moveToBottom()

move node to bottom

moveToTop()

move node to top

moveUp()

move node up

off(typesStr)

remove event bindings from the node. Pass in a string of event types delimmited by a space to remove multiple event bindings at once such as 'mousedown mouseup mousemove'. include a namespace to remove an event binding by name such as 'click.foobar'.

Parameters:
{String} typesStr

on(typesStr, handler)

bind events to the node. KineticJS supports mouseover, mousemove, mouseout, mousedown, mouseup, click, dblclick, touchstart, touchmove, touchend, dbltap, dragstart, dragmove, and dragend. Pass in a string of event types delimmited by a space to bind multiple events at once such as 'mousedown mouseup mousemove'. include a namespace to bind an event by name such as 'click.foobar'.

Parameters:
{String} typesStr
{function} handler

rotate(theta)

rotate node by an amount in radians

Parameters:
{Number} theta

rotateDeg(deg)

rotate node by an amount in degrees

Parameters:
{Number} deg

setAbsolutePosition(pos)

set absolute position relative to stage

Parameters:
{Object} pos: object containing an x and y property

setAlpha(alpha)

set alpha. Alpha values range from 0 to 1. A node with an alpha of 0 is fully transparent, and a node with an alpha of 1 is fully opaque

Parameters:
{Object} alpha

setAttrs(config)

set attrs

Parameters:
{Object} config

setCenterOffset(x, y)

set center offset

Parameters:
{Number} x
{Number} y

setDefaultAttrs(confic)

set default attrs

Parameters:
{Object} confic

setDetectionType(type)

set detection type

Parameters:
{String} type: can be "path" or "pixel"

setDragBounds(bounds)

set drag bounds

Parameters:
{Object} bounds
{Number} bounds.left Optional: left bounds position
{Number} bounds.top Optional: top bounds position
{Number} bounds.right Optional: right bounds position
{Number} bounds.bottom Optional: bottom bounds position

setDragConstraint(constraint)

set drag constraint

Parameters:
{String} constraint

setPosition(point)

set node position

Parameters:
{Object} point

setRotation(theta)

set node rotation in radians

Parameters:
{Number} theta

setRotationDeg(deg)

set node rotation in degrees

Parameters:
{Number} deg

setScale(scaleX, scaleY)

set node scale. If only one parameter is passed in, then both scaleX and scaleY are set with that parameter

Parameters:
{Number} scaleX
{Number} scaleY

setX(x)

set node x position

Parameters:
{Number} x

setY(y)

set node y position

Parameters:
{Number} y

setZIndex(zIndex)

set zIndex

Parameters:
{int} zIndex

show()

show node

transitionTo(config)

transition node to another state. Any property that can accept a real number can be transitioned, including x, y, rotation, alpha, strokeWidth, radius, scale.x, scale.y, centerOffset.x, centerOffset.y, etc.

Parameters:
{Object} config
{Number} config.duration Optional: duration that the transition runs in seconds
{String} config.easing Optional: easing function. can be linear, ease-in, ease-out, ease-in-out, back-ease-in, back-ease-out, back-ease-in-out, elastic-ease-in, elastic-ease-out, elastic-ease-in-out, bounce-ease-out, bounce-ease-in, bounce-ease-in-out, strong-ease-in, strong-ease-out, or strong-ease-in-out linear is the default
{Function} config.callback Optional: callback function to be executed when transition completes

Classes

Class Kinetic.Node