Canvas

(part of package 'Canvas') Extends designtime/SolutionModel: JSWebComponent Extends runtime: RuntimeWebComponent

This is a reference page; many components have detailed usage guides here.

Properties

canvasObjects

Type: canvasObject[]


canvasOptions

Type: canvasOptions


gridSize

Type: int Default Value: 10


imagesLoader

Type: media[]


showGrid

Type: int Default Value: 0


snapToGrid

Type: int Default Value: 0


styleClass

Type: styleclass


Events

afterRender


onClick


onLongPress


onModified


onReady


API

ZoomOnPoint

Zooms into the canvas given the x/y coords and a zoom level.

@param {Number} x @param {Number} y @param {Number} zoom

Parameters:

x int y int zoom int


addObject

Add one or more canvas objects and optionally select it. If given more than one item in the objs array, the elements will be grouped as a single entity.

@param {Array<Object>} objs @param {Boolean} setActive

Parameters:

object object setActive boolean (optional)


bringToFront

Brings a specific element given it's ID, to the front layer of the canvas

@param {string} idx

Parameters:

id string


clearCanvas

Clear the canvas and remove all objects


copySelectedObject

clones the currently selected element.


getSelectedObject

Get the selected object

@param {Function} cb

Parameters:

saveCB function


loadCanvas

Loads the canvas from a JSON object

@param {Object} data

Parameters:

data string


printCanvas

Print the current canvas view (TING only). Can use an optional DPI resolution for higher quality prints.

@param {Number} resolutionWidth

Parameters:

resolutionWidth int


removeObject

Remove an canvas object given it's ID.

@param {String} idx

Parameters:

id string


rotate

Rotate the canvas at a specific angle

@param {Number} angle

Parameters:

angle int


saveAsImage

Save the canvas as an image. The callback has a single parameter which contains the base64 data of the canvas.

@param {Function} imgCB

Parameters:

imgCB function


saveCanvas

Save the canvas as a JSON object. The callback has a single parameter which contains the JSON object. This JSON object can be used with the loadCanvas method.

@param {Function} saveCB

Parameters:

saveCB function


setSelectedObject

Select one or more objects in the canvas given it's ID.

@param {Array<String>} ids

Parameters:

ids object


startAnimate

Start animating sprites


stopAnimate

Stop animating sprites


updateObject

Update a specific canvas object and optionally select it

@param {Object} obj @param {Boolean} setItemActive

Parameters:

object object selectActiveItems boolean


Types

canvasObject

canvasOptions

  • ZoomOnMouseScroll

    • Type: int

    • Default Value: 0

  • animationSpeed

    • Type: float

    • Default Value: 50

  • hasRotatingPoint

    • Type: int

    • Default Value: 1

  • renderOnAddRemove

    • Type: int

    • Default Value: 0

  • selectable

    • Type: int

    • Default Value: 1

  • skipOffscreen

    • Type: int

    • Default Value: 1

  • skipTargetFind

    • Type: int

    • Default Value: 0

Last updated