2.  The success of GL lead to OpenGL (1992), a platform-independent API that was  Easy to use  Close enough to the hardware to get excellent performance  Focus on rendering  Omitted windowing and input to avoid window system dependencies 2

3.  Originally controlled by an Architectural Review Board (ARB)  Members included SGI, Microsoft, Nvidia, HP, 3DLabs, IBM,…….  Now Khronos Group  Was relatively stable (through version 2.5) ▪ Backward compatible ▪ Evolution reflected new hardware capabilities ▪ 3D texture mapping and texture objects ▪ Vertex and fragment programs  Allows platform specific features through extensions 3

5.  Performance is achieved by using GPU rather than CPU  Control GPU through programs called shaders  Application’s job is to send data to GPU  GPU does all rendering

6.  Totally shader-based  No default shaders  Each application must provide both a vertex and a fragment shader  No immediate mode  Few state variables  Most 2.5 functions deprecated  Backward compatibility not required

7.  OpenGL ES  Embedded systems  Version 1.0 simplified OpenGL 2.1  Version 2.0 simplified OpenGL 3.1 ▪ Shader based  WebGL  Javascript implementation of ES 2.0  Supported on newer browsers  OpenGL 4.1 and 4.2  Add geometry shaders and tessellator

8. 8

9.  Windows only  Advantages  Better control of resources  Access to high level functionality  Disadvantages  New versions not backward compatible  Windows only  Recent advances in shaders are leading to convergence with OpenGL

10.  Most OpenGL programs have a similar structure that consists of the following functions  main() : ▪ specifies the callback functions ▪ opens one or more windows with the required properties ▪ enters event loop (last executable statement)  init() : sets the state variables ▪ Viewing ▪ Attributes  initShader(): read, compile and link shaders  callbacks ▪ Display function ▪ Input and window functions

11.  Geometry specified by vertices  Locations in space( 2 or 3 dimensional)  Points, lines, circles, polygons, curves, surfaces  Immediate mode  Each time a vertex is specified in application, its location is sent to the GPU  Old style uses glVertex  Creates bottleneck between CPU and GPU  Removed from OpenGL 3.1

12.  Put all vertex and attribute data in array  Send array to GPU to be rendered immediately  Almost OK but problem is we would have to send array over each time we need another render of it  Better to send array over and store on GPU for multiple renderings

13.  Vertices can have many attributes  Position  Color  Texture Coordinates  Application data  A vertex array holds these data  Using types in vec.h point2 vertices[3] = {point2(0.0, 0.0), point2( 0.0, 1.0), point2(1.0, 1.0)};

14.  Bundles all vertex data (positions, colors,..,)  Get name for buffer then bind  At this point we have a current vertex array but no contents  Use of glBindVertexArray lets us switch between VAOs Glunit abuffer; glGenVertexArrays(1, &abuffer); glBindVertexArray(abuffer);

15.  Buffers objects allow us to transfer large amounts of data to the GPU  Need to create, bind and identify data  Data in current vertex array is sent to GPU Gluint buffer; glGenBuffers(1, &buffer); glBindBuffer(GL_ARRAY_BUFFER, buffer); glBufferData(GL_ARRAY_BUFFER, sizeof(points), points);

16.  Once we get data to GLU, we can initiate the rendering with a simple callback  Arrays are buffer objects that contain vertex arrays void mydisplay() { glClear(GL_COLOR_BUFFER_BIT); glDrawArrays(GL_TRIANGLES, 0, 3); glFlush(); }

17. 17 E. Angel and D. Shreiner: Interactive Computer Graphics 6E © Addison- Wesley 2012  Put the geometry in an array  Use pointers from the vertices into this array  Introduce a polygon list x 1 y 1 z 1 x 2 y 2 z 2 x 3 y 3 z 3 x 4 y 4 z 4 x 5 y 5 z 5. x 6 y 6 z 6 x 7 y 7 z 7 x 8 y 8 z 8 P1 P2 P3 P4 P5 v1v7v6v1v7v6 v8v5v6v8v5v6 topology geometry

18. 18 E. Angel and D. Shreiner: Interactive Computer Graphics 6E © Addison- Wesley 2012 void colorcube( ) { quad(0,3,2,1); quad(2,3,7,6); quad(0,4,7,3); quad(1,2,6,5); quad(4,5,6,7); quad(0,1,5,4); } 0 56 2 4 7 1 3 Note that vertices are ordered so that we obtain correct outward facing normals

19. 19 E. Angel and D. Shreiner: Interactive Computer Graphics 6E © Addison- Wesley 2012  The weakness of our approach is that we are building the model in the application and must do many function calls to draw the cube  Drawing a cube by its faces in the most straight forward way used to require  6 glBegin, 6 glEnd  6 glColor  24 glVertex  More if we use texture and lighting

20. 20 E. Angel and D. Shreiner: Interactive Computer Graphics 6E © Addison- Wesley 2012  OpenGL provided a facility called vertex arrays that allows us to store array data in the implementation  Six types of arrays were supported initially  Vertices  Colors  Color indices  Normals  Texture coordinates  Edge flags  Now vertex arrays can be used for any attributes

21. 21 E. Angel and D. Shreiner: Interactive Computer Graphics 6E © Addison- Wesley 2012  Using the same color and vertex data, first we enable glEnableClientState(GL_COLOR_ARRAY); glEnableClientState(GL_VERTEX_ARRAY);  Identify location of arrays glVertexPointer(3, GL_FLOAT, 0, vertices); glColorPointer(3, GL_FLOAT, 0, colors); 3d arraysstored as floats data contiguous data array

22. 22 E. Angel and D. Shreiner: Interactive Computer Graphics 6E © Addison- Wesley 2012  Form an array of face indices  Each successive four indices describe a face of the cube  Draw through glDrawElements which replaces all glVertex and glColor calls in the display callback GLubyte cubeIndices[24] = {0,3,2,1,2,3,7,6 0,4,7,3,1,2,6,5,4,5,6,7,0,1,5,4};

23. 23 E. Angel and D. Shreiner: Interactive Computer Graphics 6E © Addison- Wesley 2012  Old Method:  Problem is that although we avoid many function calls, data are still on client side  Solution:  no immediate mode  Vertex buffer object  Use glDrawArrays glDrawElements(GL_QUADS, 24, GL_UNSIGNED_BYTE, cubeIndices); Draws cube with 1 function call!!

24. 24

25. 25

26. 26

27. 27

28.  Check out http://learningwebgl.com/blog/?p=684http://learningwebgl.com/blog/?p=684 28