Thatcher Ulrich has created a perspective-correct texturing demo using triangle texture mapping. To quote Thatcher: “Old software-rendering tricks ride again!”
Not the latest newspaper, but impressive nevertheless
Thatcher explains how it works:
The subdivision method is fairly simple; the idea is that each triangle edge is tested to see how badly it needs perspective correction. Each edge is tested independently. Each edge that needs subdivision is bisected. This gives 8 cases for any triangle (each edge can either be bisected, or not), generating between 1 and 4 output triangles. Then the process is applied recursively. Because it is edge centric, adjacent triangles make the same decisions for shared edges, and there are no t-junctions.
Play around with the perspective correct texturing demo!
Canopy is a fractal tree zoomer created by Ryan Alexander using the HTML canvas element. As the tree evolves, you’ll zoom in closer and closer… it’s all a bit trippy!
Press play to start falling, click to go faster. Try turning Mutation and Bloom on. The tree will get a little weirder. What kind of forest is this?
Works best in Chrome or Safari 4.
View the Canopy demo
Running from the zombies seems to be more effective than shooting
There’s also a nice canvas rendering effect if you click the link at the top of the title screen in Firefox.
Mihai Sucan has created a helpful tutorial on how to create your very own simple HTML canvas paint application over on the Opera Developer Community.
Making a web application that allows users to draw on a canvas requires several important steps: setting up your HTML document with a canvas context (a canvas element with an id), setting up your script to target that canvas context and draw inside it and adding the required mouse event handlers for user interaction and associated logic. Once the event handlers are in place, it’s then fairly simple to add any desired functionality.
Your own paint app
Check out the tutorial and make your own paint app!
Lindenmayer systems are a compact way to describe iterative graphics, where the basic idea is to define complex objects by successively replacing parts of a simple object using a set of rewriting rules which can be carried out recursively. This smart L-system demo is made using our favourite HTML element.. canvas. If you’re lost and not sure what we’re talking about, check out Wikipedia.
View the Lindenmayer System canvas demo
Dean McNamee may get a reputation as Doctor Frankenstein after his latest canvas demo, Monster, which shows off the functionality of his forthcoming 3D canvas library pre3D.
What's that coming over the hill?
Works best in Chrome.
View the Monster demo