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(x,y,zoom)

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

Parameters:

• {int} x X

• {int} y Y

• {int} zoom Zoom

---

addObject(object,setActive)

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.

Parameters:

• {object} object Objs

• {boolean} [setActive] SetActive

---

bringToFront(id)

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

Parameters:

• {string} id Idx

---

clearCanvas()

Clear the canvas and remove all objects

---

copySelectedObject()

clones the currently selected element.

---

getSelectedObject(saveCB)

Get the selected object

Parameters:

• {function} saveCB Cb

---

loadCanvas(data)

Loads the canvas from a JSON object

Parameters:

• {string} data Data

---

printCanvas(resolutionWidth)

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

Parameters:

• {int} resolutionWidth ResolutionWidth

---

removeObject(id)

Remove an canvas object given it's ID.

Parameters:

• {string} id Idx

---

rotate(angle)

Rotate the canvas at a specific angle

Parameters:

• {int} angle Angle

---

saveAsImage(imgCB)

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

Parameters:

• {function} imgCB ImgCB

---

saveCanvas(saveCB)

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.

Parameters:

• {function} saveCB SaveCB

---

setSelectedObject(ids)

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

Parameters:

• {object} ids Ids

---

startAnimate()

Start animating sprites

---

stopAnimate()

Stop animating sprites

---

updateObject(object,selectActiveItems)

Update a specific canvas object and optionally select it

Parameters:

• {object} object

• {boolean} selectActiveItems SetItemActive

---

Types

canvasObject

scripting type: CustomType<svycanvas-Canvas.canvasObject>

• angle

  • Type: float

• ctrl

  • Type: object

• custom_data

  • Type: object

• fill

  • Type: color

• flipX

  • Type: boolean

• flipY

  • Type: boolean

• fontFamily

  • Type: string

• fontSize

  • Type: float

• frameTime

  • Type: float

• height

  • Type: float

• id

  • Type: string

• left

  • Type: float

• mediaName

  • Type: string

• objectType

  • Type: string

  • Default Value: "Rect"

• objects

  • Type: object

• opacity

  • Type: float

• path

  • Type: object

• points

  • Type: object

• radius

  • Type: float

• rx

  • Type: float

• ry

  • Type: float

• scaleX

  • Type: float

• scaleY

  • Type: float

• selectable

  • Type: boolean

• spriteHeight

  • Type: float

• spriteIndex

  • Type: float

• spriteName

  • Type: string

• spriteWidth

  • Type: float

• state

  • Type: object

• stateHolder

  • Type: object

• stroke

  • Type: color

• strokeLineJoin

  • Type: string

• strokeWidth

  • Type: float

• text

  • Type: string

  • Default Value: "Text"

• textAlign

  • Type: string

  • Default Value: "left"

• top

  • Type: float

• width

  • Type: float

canvasOptions

scripting type: CustomType<svycanvas-Canvas.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

---