API Docs for: 0.3.0
Show:

Graphic.Layer Class

The Layer class can hold several GraphicObjects and it provides some transformations methods to move or scale all the GraphicalObjects that it contains. This is helpful when you want for example apply the same plane transformation to some GraphicalObjects.

Constructor

Graphic.Layer

(
  • params
)

Parameters:

  • params Object

    All properties given to GraphicObject are available.

    • [camera] Camera optional

      camera used be the layer. if not set, a new Camera is created.

    • [spatialContainer] SpatialContainer optional
    • [localContext] CanvasRenderingContext2D optional

      you can set directly the graphic canvascontext used by the layer.

Methods

addChild

(
  • graphicObject
)

This method will allow you to add a child to the current Layer.

Parameters:

  • graphicObject GraphicObject

    this parameter must be a valid GraphicObject, otherwise the method will have an undefined behavior.

draw

(
  • context
)

Inherited from Graphic.GraphicObject but overwritten in modules/Graphic/Layer.js:103

This method allow the user to draw on the canvas's context. If nothing has changed in the childs of the layer, then a buffered layer is printed on the canvas. Otherwise all the canvas is redraw.

Parameters:

  • context CanvasRenderingContext2D

notifyParentChange

() protected

This method notify the parent that a change has been done, and that it should clear his cache.

onChange

(
  • [child]
)

This method will be called when a child is changed. By using this method it will notice the current Layer to redraw the local canvas.

This method is called automatically when a child object change. You can call this method for clear internal cache.

Parameters:

  • [child] GraphicObject optional

    this object represent the child who has been changed.

rmChild

(
  • graphicObject
)

This method will allow you to remove a child from the current Layer.

Parameters:

  • graphicObject GraphicObject

    this parameter is the GraphicObject that the method will try to find inside the child of the current layer.

rotate

(
  • angle
)
chainable

This method allow you to rotate the Graphical object around the center point of the GraphicalObject.

Parameters:

  • angle Number

    represent the angle of rotation, it's expressed in degree.

scale

(
  • x
  • y
)
chainable

this method allow you to do a scale on the GraphicObject.

Parameters:

  • x Number

    this is the x scale factor

  • y Number

    this is the y scale factor

setAttr

(
  • attrs
)
chainable

Inherited from Graphic.GraphicObject but overwritten in modules/Graphic/Layer.js:74

Setter availlable for updating attibuts and correctly clear the caches. You can set all attributes supported by this instance (see the GraphicObject constructor for common available properties)

Parameters:

  • attrs Object

    Layer attributs. See the constructor for more details.

Example:

 object.setAttr({
     width: 20,
     height: 20
 });

 object.setAttr({
     pos: {
         x: 0,
         y: 0
     }
 });

skew

(
  • a
  • b
)
chainable

This method allow you to do a skew transform on the GraphicObject.

Parameters:

  • a Number

    the factor of skew on the y axis

  • b Number

    the factor of skew on the x axis

translate

(
  • x
  • y
)
chainable

This method allow you to translate the GraphicalObject, Internally this method modify the GraphicObject's matrix.

Parameters:

  • x Number

    this is the translation scalar of the x axis.

  • y Number

    this is the translation scalar of the y axis.

update

()

This method will allow you to update the layer and all the childs within the layer.

Properties

_needToRedraw

Boolean private

indicate when the cache must be updated.

alpha

Number

value of opacity, between 0.0 (fully transparent) and 1.0 (opaque)

camera

Camera

camera of the layer.

Note: this property should be modified only with setAttr.

centerPoint

Object

default center of all matrix transformations.

values are exprimed depending on the size of the object. 0;0 is the up-left corner.

Sub-properties:

  • x Object
  • y Object

localContext

CanvasRenderingContext2D

All layers use a local 2D context canvas for rendering object. It is used as a cache layer, and redrawn only when needed.

Directly set the cache context can be usefull for debug.

Note: this property should be modified only with setAttr.

matrix

Matrix

matrix applied to this object before draw.

parent

Layer

parent containing this object.

spatialContainer

SpatialContainer

Note: this property should be modified only with setAttr.

x

Number

position on X axis

y

Number

position on Y axis

zIndex

Number

zIndex, used to determine the drawing order. Hight zIndex are drawn first.