Visualizing music with <canvas>
17th of September 2009Despite a week of meetings, interviews and uncertainty as to where I would be sleeping at night, I managed to get a little coding done this week. Continuing my experimentation with HTML5 and in particular the canvas element, I decided to write a little graphic equaliser.
I'd hoped to use the new audio element, but unfortunately the API is extremely limiting and as far as I can tell, there isn't a way to get access to the audio data in javascript. Luckily, there's an awesome library called SoundManager which provides an interface to flash's audio capabilities in javascript.
So this demo does use flash, but all the rendering is done in canvas. It's pretty CPU intensive, but a nice demo of what's possible with canvas.
The music is a recording by my good friend and ex-flatmate Marcus Phillips from his upcoming album Thirst and Burden.
As always, this has been tested in modern browsers, but won't work in IE. Also you'll need Flash 9 or above.
Distributed Raytracer - Follow up
24th of August 2009Well my server is still running, which is a nice surprise. Over 8000 people took a look at yesterday's distributed raytracer, rendering 108,000 lines between them. That's a lot more than I was anticipating — thanks to all of you for taking a look.
It became apparent today that I had done woefully little background research before posting this — Resig has posted an article about web workers that has an example of a canvas based ray-tracer that uses them to great effect. By using web workers I can get rid of a whole load of hacks that result in the currently minimal cpu usage on each node.
I think my favorite response was courtesy of thunk on Hacker News:
This is going to totally re^H^Hinvent social raytracing.
Thanks all
Distributed Raytracer
23rd of August 2009I've just released the project I've been working on for the last few days. It's a collaborative raytracer, based on my new between-browser map reduce system.
It's still young, but have a play and tell me what you think.
