> For the complete documentation index, see [llms.txt](https://nswamy14.gitbook.io/node-i2djs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://nswamy14.gitbook.io/node-i2djs/api-reference/canvas-layer.md).

# canvasLayer

### **Layer API:**

**#.canvasLayer(** *contextObject,  height,  width***);**

CanvasLayer API return rendering instance of Canvas-2D context. It accepts multiple parameters as specified below.

**Example:**&#x20;

```
var canvasLayer = canvasLayer(contextAttrObject, height, width);
```

* **contextAttrObject** - *Canvas context attributes, which will be passed to the getContext method.*
* **height:**  *height of the canvas***,**
* **width:** *width of the canvas*

### **Layer Methods:**

**Layer.setLayerId(** *String* **)  -** For setting ID attribute to the Layer Dom element.

**Layer.setClear(** *function* **) -** To set clear callback method. Accepts function as an input, which gets invoked on every refresh Cycle before render begins. The clear function gets context as an argument.

```
renderer_.setClear(function (ctx) {
		ctx.fillStyle = 'rgba(0, 0, 0, 0.1)';
		ctx.fillRect(0, 0, renderer_.width, renderer_.height);
	});
```

**Layer.SetPixelRation(** *Int* **)**; - To set device Pixel ratio.

**Layer.SetSize(** *width, height* **)**; - Optional - To set the Size of the canvas layer.  If not, the parent container size will be inherited by the layer.

**Layer.getPixels(** *x, y, width, height* **)**; - To fetch pixels from the specified rectangle area of the canvas layer. It returns the ImageData object.

**Layer.putPixels(** *imageData***,** *x, y* **)**; -  To paint pixels to the canvas. It accepts ImageData along with position x, y as an argument.

**Layer.clear( )**; - To clear the canvas. It can be invoked in some special cases to clear the canvas.

**Layer.setContext(** *prop, value* **)**; - To set properties to the canvas context.

**Layer.update( )**; - API to manually trigger the Layer update. In the case of the default behavior, all the changes from VDOM will be applied to the DOM as a part of the refresh cycle.

**Layer.destroy( )**; - To remove layer instance. It removes the DOM element along with the vDOM. and Also unbinds all the event listeners is any.
