Quick Start CanvasLayer

Get started with node-i2d to create rich visualisations on node platform.

Integrate source code as specified on the installation page.

Import node-i2djs module

let { canvasLayer } = require("node-i2djs");

Layer Creation:

node-I2Djs provides API's for Canvas, and PDF requirements. In this example, we will be using the Canvas context.

let renderer = canvasLayer({context config}, height, width);

canvasLayer API returns Canvas-2D renderer instance. It accepts parameters - contextAttrObject, Height and Width. For more details on layer API, refer to API Reference > Layers

Element Creation:

Using renderer instance we will create a circle. createEl API is used to create the Element of type 'Circle' with attributes and style properties as specified below.

let circle = renderer.createEl({
    el: 'circle',
    attr: {
        r: 50,
        cx: renderer.width / 2,
        cy: renderer.height / 2
    },
    style: {
        fillStyle: '#ff0000'
    }
})

Apply changes to Canvas Layer

renderer.update()