This document is still being written.
Canvas class was inspired by the
canvas class in the glfx API.
var canvas = new Canvas();
Before you can apply any filters you will need a canvas, which stores the result of the filters you apply. Canvas creation is done through
new Canvas(), which creates and returns a new WebGL
Textures will be garbage collected eventually when they are no longer referenced, but this method will free GPU resources immediately.
Installs a map of shader filters as methods on the
Canvas instance, as an alternative to calling them using
Creates a texture that initially stores the image from an HTML element. Notice that texture() is a method on a canvas object, which means if you want to use the same image on two canvas objects you will need two different textures, one for each canvas.
element- The HTML element to store in the texture, either an , a
This replaces the internal contents of the canvas with the image stored in texture. All filter operations take place in a chain that starts with canvas.draw() and ends with canvas.update().
Loads the image from an HTML element into the texture. This is more efficient than repeatedly creating and destroying textures.
element The HTML element to store in the texture, either an , a
This replaces the visible contents of the canvas with the internal image result. For efficiency reasons, the internal image buffers are not rendered to the screen every time a filter is applied, so you will need to call update() on your canvas after you have finished applying the filters to be able to see the result. All filter operations take place in a chain that starts with canvas.draw() and ends with canvas.update().
Get a Uint8 array of pixel values: [r, g, b, a, r, g, b, a, ...] Length of the array will be width * height * 4.