Javascript experiment with WebGL, WebRTC, FileReader and Web Workers.
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
assets
css
js
textures
CNAME
ReadMe.md
index.html

ReadMe.md

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.

This work is licensed under a Creative Commons Attribution 3.0 Unported License.

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.