imclab / kluster

Javascript experiment with WebGL, WebRTC, FileReader and Web Workers.

Kluster

Kluster is an experiment/technology demo that uses k-means clustering to create a 3D star system using the pixels of an image.

The inspiration to use k-means on image pixels came from a post by Mohit Muthanna.

View it live.

Technologies

I used this project as an opportunity to experiment with a number of new technologies.

• WebGL

  WebGL allows for hardware-accelerated graphics in a browser without plug-ins. I use the excellent Three.js to make it more manageable.

• WebRTC

  Part of WebRTC is support for accessing user hardware. Using getUserMedia(), I can display the user's webcam and allow them to grab a frame for processing.

• File API

  With the File API, I can get drag-and-dropped images into a canvas all on the client side using FileReader.

• Web Workers

  The k-means calculation takes a few moments and normally this locks up the browser and stops the animation. Using Web Workers, I can do these calculations in the background.