Processing.js

Processing.js closely mimics the original Processing language, porting most of its major features to JavaScript code.

This allows developers access to a powerful and complex data visualization tool that makes adding statistics, interactions, and various animations to a Web page much easier and simpler.

Processing.js can be used for charts, graphs, games, digital art, Web presentations, and so on.

The library heavily relies on the HTML 5 canvas element for embedding the graphics and animations, working on most modern desktop and mobile browsers.

The project is quite mature and has had enough time to build a complex set of references, docs, and demos, so it is very easy today to learn and get acquainted with it.

What is new in this release:

• This version has some fixes to PVector's rotate, support for randomGaussian(), and several unit tests to make sure those fixes pass muster.

What is new in version 1.4.1:

• 1.4.1 is a hotfix for 1.4.0, fixing a bug that prevents sketches from focusing on mouse clicks.

What is new in version 1.3.6:

• Fixed arc() not filling the last half degree.
• Fixed camera() call order regression in 1.3.5.
• Fixed delay() to throw an unsupported function error.

What is new in version 1.3.5:

• Added check for canvas in Processing ctor
• Added document.head compatibility for Firefox 3.6
• Added reference to p instance in onLoad()
• Added text(string, x, y, z) ref tests
• Disabled WebGL anti-aliasing
• Fixed PImage.mask() when passed a PImage created from a PGraphics
• Fixed PImage.toImageData not using cache
• Fixed colorMode not working in 3D
• Fixed copy() without a source argument
• Fixed frustum() not throwing an error in 2D mode
• Fixed get() not returning a copy of a PImage
• Fixed get(x,y) when called on 3D PGraphics
• Fixed getUniformLocation checking for null
• Fixed lights not being applied to textures
• Fixed modelX/Y/Z() failing if camera() was not called first
• Fixed noFill()/noStroke() not working if called before size()
• Fixed pixels not allowed as a variable name in classes
• Fixed pmouseX/Y values during draw()
• Fixed rectMode() not working in 3D
• Fixed textWidth() returning a string instead of a number
• Fixed texture UV coordinates not normalized and clamped with NPOT textures
• Fixed texture() modifying a NPOT PImage passed to it
• Fixed tint() ignoring alpha parameter
• Fixed tint() not marking a PImage as dirty
• Fixed using p as a class member identifier
• Fixed vertical align in textAlign()
• Optimized use of curRectMode and curEllipseMode
• Removed p.Import

What is new in version 1.3.0:

• Added a chart to the perf test suite
• Added an error message to the ref test builder if ‘exit()' is not found in the sketch
• Added blendColor ref tests
• Added codePointAt to the String object
• Added documentation to toP5String function
• Added equalsIgnoresCase to String object
• Added error messages to beginCamera and endCamera when used in 2D mode
• Added error messages to Processing file and I/O functions that are unsupported by Processing.js
• Added printMatrix unit tests
• Added resetMatrix unit tests
• Added rounded rect
• Added screenWidth and screenHeight variables to match Processing v2.0
• Added script to build process to replace PConstants.* with their numerical values
• Added startsWith and endsWith to the String object
• Added support for external javascript code to add images to the imageCache
• Added tint perf and ref tests
• Added toArray() to the Array object
• Added transparency perf test
• Changed function(){} to the Processing local variable ‘nop'
• Changed obj.constructor type-checking to typeof(obj)
• Changed perf tests to use exit()
• Changed Processing.js errors to throw instead of print to tinylog
• Converted animated test suite tests to ref tests
• Converted XMLElement unit tests to use XMLElement.parse(string) instead of XMLElement(string)
• Fixed crisp not working properly when any transformations were applied to the sketch
• Fixed CSS font declaration when using SVG fonts
• Fixed default vertical align in textMode(halign, valign) to BASELINE
• Fixed equalsIgnoreCase to use toLowerCase rather than RegEx(//i)
• Fixed fake-dom.js returning the same canvas every time createElement is called
• Fixed font metrics (textAscent, textDescent, etc.)
• Fixed font preloading not checking whether a @font-face rule already exists
• Fixed font preloading to use tinyfont
• Fixed font quoting bug in computeFontMetrics
• Fixed HashMap.values() so that it returns an ArrayList
• Fixed hex literal #FFFFFF not being converted to an int properly
• Fixed HSB functions ignoring colorMode range in grayscale
• Fixed httpd.py webserver to be multi-threaded and MSIE compatible
• Fixed image() not working in 3D mode
• Fixed lerpColor generating incorrect values in HSB color mode
• Fixed make release-files creating the temporary file in the wrong directory
• Fixed mandelbrot.pde and histogram.pde ref tests

What is new in version 1.2.3:

• Added a note to the test suite about Opera failing Cursor
• Added httpd.py to the distribution in order to run a local http server for testing
• Added Shiffman's "Nature of Code" into parser test suite
• Added support for hash/bookmark url from sketch loading
• Added both inline and external loading samples to the example.html example
• Add JavaScript event hooks to Sketch
• Changed Processing.logger back to tinyLogLite
• Changed the script attribute used to target a canvas from data-target to data-processing-target
• Converted test suite #113 and #114 to ref tests
• Converted README to README.md
• Converted ref tests to have proper draw loops with exit() in them
• Created SVG ref tests
• Created curve* ref tests.
• Created more background() ref tests
• Created makefile documentation
• Deleted dead code in processing.js
• Deleted unused variables and functions
• Expanded test suite configurations for more OS/browser combos
• Expanded lerp unit test beyond r/g/b
• Fixed ArrayList's copy constructor
• Fixed processing.js header to include type of distribution
• Fixed processing-helper to work when creating 3D tests after 2D tests
• Fixed 3D points to take strokeWeight() into account
• Fixed exit() to properly release events that are bound to sketches
• Fixed split() so it doesn't scope-conflict with objects that implement their own split function
• Fixed Test suite blur test to properly load second image
• Fixed ref test runner so it can re-run without reloading the page
• Fixed parser so that all classes in a deep class hierarchy get a $base
• Fixed ref test runner to use epsilonOverride global value when higher than test-specified value
• Fixed failing ref tests due to pixel diff errors
• Fixed build system to run make check-lint as part of make check
• Fixed test suite #56 alpha mask on IE9 and Opera
• Fixed processing helper preloading in Firefox 4
• Fixed ref tests that use text
• Fixed event handler leaks processing.js
• Fixed error messages when local files cannot be loaded
• Fixed ref test runner to properly diff images
• Fixed ref test runner to properly sort completed tests
• Fixed test suite and ref test runner to use minified vs. full processing.js in test suite
• Fixed Makefile to be Windows-friendly
• Fixed @pjs directives to work when multiple directives are specified
• Fixed build system to add version number and header to minified processing.js
• Fixed build system so that release target triggers check-release automatically
• Fixed example.html to use size() instead of canvas width/height
• Fixed regression from #1363
• Fixed SVG path "m" statement regression
• Fixed loadImage() reference to not mention signing applets
• Fixed SVG regression from failed merge
• Fixed loadShape()
• Fixed Makefile so that check-closure does not die mid-way
• Fixed PVector.set to not set z to undefined (NaN)
• Fixed is3D regex in ref tester
• Fixed case-sensitivity in ref test SVG filenames and associated tests
• Implemented fillStyle
• Implemented __hashCode function via virtHashCode
• Investigated the suitability of implementing the A3D Renderer
• Moved the utility functions (extendClassChain, defineProperty, ...) to defaultScope
• Refactored rotateZ into 2D and 3D methods
• Refactored mag() to use function args
• Refactored vertex() to use function args
• Refactored line() to use function args
• Removed fixOperaCreateImageData()
• Removed fixOperaCreateImageData() in ref test runner
• Removed delay() from Reference
• Removed init and loadSketchFromSources from the api version of pjs
• Removed init.js from repo and /download
• Removed uses of eval("...")
• Removed impossible parser tests
• Removed duplicate loadSketchFromSources and disableInit
• Removed nop and eval_ from the global closure arg list
• Removed @pjs transparency directive
• Restored feature to load inline sketches after accidental deletion
• Rewrote beginDraw and endDraw comments to better explain their presence

What is new in version 1.2.1:

• Fixed background() when called with 3 arguments.
• Fixed use @pjs transparent directive.
• Updates to build system for testing, release.

What is new in version 1.1.0:

• Support for touch events on iOS devices.
• mouseOver and mouseOut events were added to allow events to take place when the user enters and leaves a canvas.
• A custom pjs packager has been created that can take a sketch and package it together with the library, strip out unneeded code, minify it, and create a final .js file that is much smaller in size and lightweight.
• An option was added to the makefile that allows you to create an API only version of processing.js.
• Numerous website updates were done to the reference pages and documentation.

What is new in version 1.0.0:

• Added source level documentation for functions
• Added reference pages for missing language features
• Added sketchpad.cc to list of dev tools
• Added saveFrame()
• Added remaining PImage features
• Added compile-time optimizations for constants, functions, closures
• Added PShapeSVG(new XMLElemnt(svg string))
• Added check for missing use of ‘new' to Processing() calls
• Added test for casting and negative ints
• Added cursor URL example to test suite
• Added Makefile target for examples packaging
• Created wiki for processingjs.org
• Created quick start guides for Processing and JavaScript developers
• Fixed keyReleased so it doesn't fire when key is held down
• Fixed neighborhood.html
• Fixed translate() call ordering with background()
• Fixed issue with loadStrings() so it doesn't remove last character
• Fixed matrix operations run in setup such that they are not reset in draw
• Fixed remaining KNOWN-FAILURES that were fixable
• Fixed performance issue with Image() function when mask and tint aren't specified
• Fixed performance issue with text$line
• Fixed SVG to work properly with negative widths
• Fixed PShapeSVG/PShape to be public
• Fixes to allow WebKit to load 3D sketches
• Fixed PImage.mask to work with objects generated by PGraphics.get
• Fixes to support IE9
• Fixed parser to accept additional float literal formats
• Fixed performance issue with ArrayList
• Fixed issue with abstract methods
• Fixed text 3D error
• Fixed mouseX/mouseY values to take scrollbars into account
• Fixed parser bug with discarded processing methods
• Fixed performance issue with uniformMatrix and vertexAttributePointer
• Fixed (int) casting
• Fixed non-power-of-two texture load issue
• Fixed all non-power-of-two images in source tree
• Fixed text-width example in Firefox and Ubuntu
• Fixed method invocation using this and super
• Fixed js linting issues
• Fixed ref test runner for Uint8Array
• Fixed Learning IDE frame rate bug
• Removed .svn dirs from source tree
• Updated fake-dom.js for curContext.setTransform
• Updated processingjs.org (many fixes, corrections)
• Updated documentation for loadImage, requestImage, @pjs preloading

Requirements:

• JavaScript enabled on client side
• HTML 5 enabled browser