WebGL Layer

Layer API:

#.webglLayer( #containerId, contextAttrObj, Layersettings );

webglLayer API returns rendering instance of WebGL-2D context. It accepts arguments the same as CanvasLayer API.

Example:

var webglLayer = i2d.webglLayer('#containerId', {
    premultiplieAlpha: false,
    depth: false
}, {
    autoUpdate: true
})

• containerID :- CSS ID selector which uniquely identifies the container in which the Canvas element will be rendered.

• contextAttrObject :- Canvas context attributes, which will be passed to the getContext method.

• SettingsObj - Object with below settings.

  • enableEvents - Boolean - Flag to enable/disable events for the rendered layer. Default is False

  • enableResize - Boolean - Flag to enable/disable window resize event. If it is disabled, the layer won't be resized on the container resize. Default is True.

  • autoUpdate - Boolean - To disable auto rendering of VDom changes to DOM. Used only in special cases to improve rendering performance. On disabling, one should invoke layerInstance.update() to manually render the changes to the DOM.

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 refreshCycle before render begins. The Clear function gets context as an argument.

Layer.setClearColor ( Color );

Layer.setAttr ( attr, value ); - To set attributes to the layer Dom Element.

Layer.setStyle ( prop, value ); - To set style properties to the layer Dom Element.

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.enableEvents ( Boolean );

Layer.getPixels ( x, y, width, height ); - To fetch pixels from the specified rectangle area of the canvas layer. It returns 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 ( );

Layer.setContext ( prop, value ); - To set properties to the WebGL 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 if any.

Layer.MeshGeometry (); -

Layer.PointsGeometry ();

Layer.LineGeometry ();

Layer.TextureObject ();

Layer.RenderTarget ();