90 likes | 243 Views
CSPC 352: Computer Graphics. WebGL and Three.js. Phew. Lot’s of work to create a WebGL program, setting up buffers and shaders , etc . Can we do cool stuff with much less code?. Three.js. Features:. Three.js. Written by Mr.doob aka Cabello Miguel of Spain
E N D
CSPC 352: Computer Graphics WebGL and Three.js
Phew. • Lot’s of work to create a WebGL program, setting up buffers and shaders,etc. • Can we do cool stuff with much less code?
Three.js • Features:
Three.js • Written by Mr.doob aka Cabello Miguel of Spain • Perceived leader of WebGL frameworks
Getting Started • A document to draw on:
Three.js basics • To display something with Three.js we need: • A scene • A camera • A renderer
Adding geometry • Now we need to add an object to the scene:
Render the scene • Result
Import/export • What object format to use? • Creating something new? Try Blender exporter • Want to convert existing objects? Try OBJ format • Collada: support not very mature