November 8, 2013 – Web 3D Graphics With THREE.js

[original tumblr post]

 

Web 3D Graphics With THREE.js

[ image source: screen shot of threejs.org site ]

As I’ve mentioned in the two previous posts, a better way to get started with doing 3D (or 2D) graphics in a web browser, as opposed to working with raw WebGL, is to use the THREE.js library/API.

THREE.js offers a really easy to use API and provides a great deal of convenient access to all the things you’ll need for doing 3D on the web.

And it is very extensively used … many of the Google Chrome experiments have been done with THREE.js, and there are tons of examples out, including professional web apps, that use it.

To get started I recommend watching these two videos:

        o  threejs_playGnd – 1 ( three.js / webGL tutorial video )

        o  threejs_playGnd – 2 ( three.js / webGL tutorial video )

… and then hopping over to this site to try things out with some live JavaScript/THREE.js coding:

        o  http://threejsplaygnd.brangerbriz.net/gui/

And Here are a couple of great tutorial posts on getting started with THREE.js …

        o  Treehouse blog’s “Beginner’s Guide to three.js” post

        o  Aerotwist’s “Getting Started with THREE.js” page

And, last but not least, here is a really great post with tons of links to examples, videos, and resources for THREE.js …

        o  How to Learn Three.js for Game Development (from gamedev tuts+)

Well, that should be lots to get you going. If all else fails, just do a web search on THREE.js and you’ll get a lot of stuff back.

Happy Friday!