Sunday, January 24, 2016

3D web graphics.

A new feature of modern web browsers is web.gl.  This language allows browsers to take advantage of the hardware graphics acceleration in your computer.  Its a little awkward to program in so the three.js library was born.  Its an open source project.  To learn this framework I created some experiments.  Please click on the links below.  The images can be rotated and panned with your mouse.

A starburst pattern   A cylinder made of lines
 A flat Square   An open cube with shading 
Polygon with gradient coloring - these were some simple, first experiments

Stairway with Shading       Mesh a Cylinder 
Mesh a segmented Cylinder
Mesh a Cylinder turned into a vase
Mesh a Cylinder turned into a torus - these are meshed from many tiny, individual
triangles. They do not use the Three.js premeshed objects.

Cube matrix with animated color    An animated solar system
Bunch of Boxes   A ziggurat
A ziggurat with controls 
A helix of objects  A helix of any 'ole object

Citi-scape
Cubes changing color      A tiny solar system
A torus explorer   Click square to make wave

Finally, these are some water simulations.  Click on the water to make waves.:
Hugo Elias Algorithm - makes multiple waves with interference at edges
Transverse Wave Algorithm - can make 1 wave at a time.
Another algorithm

1 comment:

  1. This comment has been removed by a blog administrator.

    ReplyDelete