Add script to your page:

<script src="js/raster-pro-min.js"></script>

Now RasterPro is ready for use!

Create an empty DIV and give it an ID (e.g. "DIV_ID").
Create a RasterPro instance, indicating the DIV ID and settings:

var halftone_image = new RasterPro("DIV_ID",{
    //settings
});

Done!
You can even create multiple halftones on your page.
Each setting has a default value and can be ignored. Here is a complete list of settings.
Use our online generator to choose settings quickly:

1. Change some properties
2. Push "copy settings"
3. Paste text into your code
4. Change SOURCE_IMAGE property

Let's say your DIV already contains halftone image.
Create a new RasterPro instance for the same DIV:

halftone_image = new RasterPro("DIV_ID",{
    //new settings
});

A new instance will replace the old one.

halftone_image.clear();   Clears canvas.
halftone_image.update();   Updates halftone image. It will be useful if you want to clear canvas for a while.
halftone_image.destroy();   Removes everything related to RasterPro instance.
halftone_image.resize();   Sets correct scale and position according to your DIV size. In most cases, you will not need this method. It should be used only when you change DIV size by JavaScript.

Complete list of RasterPro settings is located here. Each of them can be changed on the fly using JavaScript.
Below is the list of RasterPro instance properties.
halftone_image.sourceImage — path to source image
halftone_image.rasterType — halftone pattern name
halftone_image.rasterAngle — number defining the raster line rotation
halftone_image.dotSize — raster dot size
halftone_image.lineSmoothing — line smoothing of "line" and "cell" patterns
halftone_image.canvasColor — canvas color
halftone_image.dotColor — raster dot color
halftone_image.dotColorRandomization — number defining dot color randomization
halftone_image.dotColorRRandomization — number defining randomization of dot color R-component
halftone_image.dotColorGRandomization — number defining randomization of dot color G-component
halftone_image.dotColorBRandomization — number defining randomization of dot color B-component
halftone_image.canvasWidth — output image width
halftone_image.canvasHeight — output image height
halftone_image.scaleMode — defines how halftone image scale depends on DIV size
halftone_image.brightness — source image brightness
halftone_image.contrast — source image contrast
halftone_image.invert — defines whether to invert the source image
halftone_image.allowTurboRendering — defines whether to render at the maximum possible speed
halftone_image.showRenderingProgress — defines whether to display halftone image during rendering
halftone_image.usePreloader — defines whether to display preloader animation
halftone_image.preloaderColor — preloader color
halftone_image.preloaderSize — preloader size