A project using javascript to learn more about the HTML 5 canvas tag.
Just download into a zip, or clone, then open the index.html in a browser.
This is a dynamic paint program. There is some different tools.
-
Draw tool This tool shoots pixels out in all directions from the position of the mouse. It can either be random colours or a set color. This toggled by the down arrow. Also the spread of the pixels from the mouse can be controlled by the left and right arrow keys.
-
Node tool This tool creates a single point on the canvas that spawns pixels in all directions. The colour can be changed or edited
-
Link tool This creates 2 nodes, where one links to the other. To use this tool click once then another time and a menu will pop up. The second node will be turned off. And the pixels will flow from the first node to the second. The spread can be controlled.
-
Flow tool The flow tool continually makes nodes and links as long as the mouse is held down and moved around.
Take note of the edit menu on the bottom right, it can be used to edit any node after selecting a node from the node list.
Feel free to play around, there is a lot of cool things that can be made!
Also note, if the linked(ID) property of a node is "receiver" that means it will not spawn any pixel blocks.