Toxiclibs.js is an open-source computational design library ported to javascript by Kyle Phillips originally written by Karsten Schmidt for Java and Processing. Examples of the original library can be found at http://toxiclibs.org
Toxiclibs.js works great with Canvas, with SVG or any ordinary DOM element. Examples below pair with such fine libraries as: Processing.js, Three.js, or Raphael.js for SVG.
I will be creating an exhibition section soon, if you have used toxiclibs.js and would like it to be included, e-mail information to kyle [at] haptic-data.com, or tweet me.
Toxiclibs.js can be used in the following ways:
To use as a single javascript file:
//copy the file build/toxiclibs.js into your javascript folder
<script type="text/javascript" src="js/toxiclibs.js"></script>
<script type="text/javascript">
var myVector = new toxi.geom.Vec2D(window.innerWidth,window.innerHeight).scaleSelf(0.5);
var myColor = toxi.color.TColor.newRGB(128/255,64/255,32/255);
</script>
To use with RequireJS :
//copy the lib/ contents into your projects folder for loading modules
require(['toxi/geom/Vec2D', toxi/color/TColor], function(Vec2D, TColor){
var myVector = new Vec2D(window.innerWidth,window.innerHeight).scaleSelf(0.5);
var myColor = TColor.newRGB(128/255,64/255,32/255);
});
To use with Node.js :
npm install toxiclibsjs
then:
var toxi = require('toxiclibsjs'),
myVector = new toxi.geom.Ve2D(0.5,0.5),
myColor = toxi.color.TColor.newRGB(128/255,64/255,32/255);
There are many different ways to use toxiclibs.js. Most of the examples currently use Processing.js and are created using the java-syntax style of the original Processing . This can be helpful to those that are making the transition from Java, but can be confusing to others. I will explain the basics of using toxiclibs.js and the few differences between it and the original toxiclibs .
For comprehensive documentation, read the original libraries javadocs . As the library is still growing, you can compare that documentation to this list of implemented classes.
The following objects are returned when loading the entire library
This section will occassionally be expanded on. If you have a suggestion, or have a question on how something works, feel free to leave an issue and I am quick to respond.