Processing is a famous language for Digital Artists and Makers. It is based on Java, but now Javascript is also supported by the regular Processing IDE. It is using the canvas element from HTML5, and most of the Java code was ported to run in Javascript only.

I tried a quick example.

In this example I am switching the Red and Blue channels of a picture, and also applying a sharpening filter on the Green channel.

Sharpening is done using this high pass filter :

float v = 1.0 / 8.0;
float sharp = 2;
float kernel = {{ -sharp*v, -sharp*v, -sharp*v },
{ -sharp*v, +sharp+1, -sharp*v },
{ -sharp*v, -sharp*v, -sharp*v }};

Check the results here. Image processing will be done by your web browser, so it is a little bit slow. 🙂

Source code is here.

I was pleased to see how easy it is to work with Processing, so I plan to implement the basic image processing algorithms and functions. I believe Processing.js is a great way to write educational applets about Image Processing.