rodrigosclosa / FILTER.js

Image Processing and Computer Vision Library in JavaScript

#FILTER.js

A pure JavaScript Library for Image/Video Processing, Filtering and Computer Vision

This is a library for processing images/video in pure JavaScript using HTML5 features like Canvas, WebWorkers, WebGL and SVG (in progress) or analogs in Node.js (todo).

version 0.7.2

• filter.js / filter.min.js
• filter.codecs.js / filter.codecs.min.js
• filter.plugins.js / filter.plugins.min.js
• filter.bundle.js, filter+codecs+plugins+dependencies

see also:

• Contemplate a light-weight template engine for Node/JS, PHP, Python, ActionScript
• HtmlWidget html widgets used as (template) plugins and/or standalone for PHP, Node/JS, Python (can be used as plugins for Contemplate engine as well)
• Tao A simple, tiny, isomorphic, precise and fast template engine for handling both string and live dom based templates
• ModelView a light-weight and flexible MVVM framework for JavaScript/HTML5
• ModelView MVC jQueryUI Widgets plug-n-play, state-full, full-MVC widgets for jQueryUI using modelview.js (e.g calendars, datepickers, colorpickers, tables/grids, etc..) (in progress)
• Dromeo a flexible, agnostic router for Node/JS, PHP, Python, ActionScript
• PublishSubscribe a simple and flexible publish-subscribe pattern implementation for Node/JS, PHP, Python, ActionScript
• Regex Analyzer/Composer Regular Expression Analyzer and Composer for Node/JS, PHP, Python, ActionScript
• Xpresion a simple and flexible eXpression parser engine (with custom functions and variables support) for PHP, Python, Node/JS, ActionScript
• Dialect a simple cross-platform SQL construction for PHP, Python, Node/JS
• Abacus a fast combinatorics and computation library for Node/JS, PHP, Python, ActionScript
• Asynchronous a simple manager for async, linearised, parallelised, interleaved and sequential tasks for JavaScript

###Contents

• Live Examples
• Browser Support
• Credits
• Features
• API Reference
• ChangeLog
• Todo

###Live Examples

• Image Processing with Filter.js
• Video Processing with Filter.js
• Sound Visualization with Filter.js
• Filter.js with Three.js
• Filter.js Image Codecs test

###Browser Support

###Credits

Some filters code has been adapted from open source libraries (mostly c, java and flash, plus a couple from javascript libraries), see the comments in the code for details.

• Image Processing Library in Java
• AS3 Image Processing Library
• AS3 ColorMatrix by @GSkinner
• Simplex Noise and Perlin Noise by Stefan Gustavson
• JSManipulate
• glfx.js
• JViolaJones
• OpenCV, HAAR cascades

Some image processing/computer vision theory, basics and tutorials:

• a beginners guide to bitmaps by Paul Burke
• digital image filtering (with emphasis on imagemagick)
• image processing basics
• fundamentals of image processing
• fundamentals of image processing
• image filtering basics for machine vision
• image segmentation techniques
• simplex noise demystified tutorial
• fast almost-Gaussian filtering using integral filters
• image processing in C
• computer vision: algorithms and applications (draft)
• OpenCV, open source computer vision

###Features

The library dependencies are:

• Classy.js micro Object-Oriented framework.
• Asynchronous simple manager for async/parallel tasks.

The framework defines an Image Proxy class, which represents an Image, a Color Class, Image Loader classes, Image Codecs, and 8 generic Filter types plus various Plugins (with support for parallel processing transparently)

0. AbstractFilter
1. ColorMatrixFilter (analogous to the ActionScript filter)
2. TableLookupFilter
3. ConvolutionMatrixFilter (analogous to the ActionScript filter)
4. DisplacementMapFilter (analogous to ActionScript filter)
5. GeometricMapFilter
6. MorphologicalFilter
7. StatisticalFilter (previously called NonLinearFilter)
8. CompositeFilter (an abstraction of a container for multiple filters)

Parallel Workers Support (support parallel procesing/filtering with filter workers in an intuitive and transparent way)

Extension by Plugins / Inline Filters

Image Blending Modes (analogous to PhotoShop blend modes)

Each generic filter is prototype but it also includes basic implementation filters like grayscale , colorize , threshold , gaussBlur , laplace , emboss , and so on..

TIP: You can create your custom build of the library with the filters/plugins you choose. Each filter and plugin is independent and can be used in a mix-n-match manner, as long as the core classes are always included. Change the dependencies file(s) to include your own selection of filters and plugins for your custom build

###Todo

• add full support for Node.js (todo, in progress)
• add WebGL support for various pre-built and custom Filters (todo, in progress)
• add SVG Filters interface support for various pre-built and custom Filters (todo, in progress)
• add CSS Filters interface support for various pre-built and custom Filters (todo, in progress)
• add (generic/native) codec support for image formats, e.g .TGA, .HDR/.RGBE, .GIF, .BMP, .PNG, .JPG/.JPEG etc.. [DONE]
• add 2d-fft routines, frequency-domain filtering [DONE partially]
• add image segmentation/classification algorithms (e.g kmeans, em, meanshift) (todo)
• add support for Parallel Processing using Web Workers and/or Asynchronous Processing [DONE partially]
• make convolutions/statistics faster [DONE partially]
• use fixed-point arithmetic, micro-optimizations where possible [DONE partially]
• add caching of filter parameters where applicable [DONE partially]
• add more filters/plugins (eg split/combine/adaptive/nonlinear etc..) [DONE partially]
• increase support/performance for Opera, IE [DONE partially]

URL Nikos Web Development
URL FILTER.js blog post
URL WorkingClassCode