1) What is WebGL?
WebGL stands for Web Graphics Library. It is a JavaScript API that is used for rendering 3D graphic in any compatible web browser. It is written in JavaScript.
2) Who is the developer of WebGL?
Vladimir Vukicevic is the developer of WbGL.
3) What are the advantages of WebGL?
WebGL advantages are:
- It is JavaScript programming.
- Increasing support with mobile browsers.
- It is open source.
- No need for collection Automatic memory management.
- It is easy to set up.
4) What is OpenGl?
OpenGl stands for Open Graphics Library. It is cross language and cross platform API for 2D and 3D Graphics.
5) What is Rendering and its type?
Rendering is the process of generating an image from a model by using computer program.
There are two types of rendering:
- Software Rending
- Hardware Rending
6) What is HTML5 Canvas in WebGL?
In WebGL, HTML5
<canvas> provides an easy and powerful technique to draw graphics using JavaScript.
Syntax:
<canvas id = "mycanvas" width = "100" height = "100"></canvas>
7) How can we create a Canvas program?
We can create a Canvas program by using following codes:
<html>
<head>
<style>
#mycanvas{border:1px solid red;}
</style>
</head>
<body>
<canvas id = "mycanvas" width = "100" height = "100"></canvas>
</body>
</html>
8) What are Vertex Shader and its task?
Vertex shader is the program code that is used to move the geometry from one place to another. It handles the data of each vertex.
The following tasks are:
- Vertex transformation
- Normal transformation and normalization
- Texture coordinate generation
- Texture coordinate transformation
- Lighting
- Color material application
9) How can we create WebGL Applications by using HTML5 2DCanvas?
We can create WebGL Application by passing the string
experimental-webgl. It uses
canvas.getContext() method.
Example:
<!DOCTYPE html>
<html>
<canvas id = 'my_canvas'></canvas>
<script>
var canvas = document.getElementById('my_canvas');
var gl = canvas.getContext('experimental-webgl');
gl.clearColor(0.9,0.9,0.8,1);
gl.clear(gl.COLOR_BUFFER_BIT);
</script>
</html>
10) What is Buffer and its type in WebGL?
In WebGL, Buffer is the memory area that holds the data.
There are various buffers:
- Vertex buffer objects: It is used to stores the data corresponding to each vertex.
- Index buffer objects: It is used to stores the data about the indices.
- Frame buffer: It holds the scene data. This buffer contains details such as width and height of the surface (in pixels).
11) What are the drawing modes supported by WebGL?
WebGL supported following drawing modes that are listed in table:
| Mode |
Description |
| gl.POINTS |
It is used to draw a series of points. |
| gl.LINES |
It is used to draw a series of unconnected line segments. |
| gl.LINE_STRIP |
It is used to draw a series of connected line segments. |
| gl.LINE_LOOP |
It is used to draw a series of connected line segments. It also joins the first and last vertices. |
| gl.TRIANGLES |
It is used to draw a series of separate triangles. |
| gl.TRIANGLE_STRIP |
It is used to draw a series of connected triangles in strip fashion. |
| gl.TRIANGLE_FAN |
It is used to draw a series of connected triangles sharing the first vertex. |
12) What is the use of Translation and its step to translate a Triangle in WebGL?
In WebGL, Translation is used to move a triangle (any object) on the XYZ plane.
There are following steps to translate a Triangle.
- Prepare the Canvas and Get the WebGL Rendering Context.
- Define the Geometry and Store it in the Buffer Objects.
- Create and Compile the Shader Programs.
- Create and Compile the Shader Programs.
13) What is Scaling in WebGL?
In WebGL, Scaling is used to increase or decrease the size of an object.
14) What is Buffer Objects and its types?
A buffer object is a mechanism that indicates a memory area. It is allocated in the system. It is reside in GPU memory.
There are two types of buffer objects:
- Vertex buffer object (VBO)
- Index buffer objects (IBO)
15) What do you mean by WebGL Graphics Pipeline?
Graphics Pipeline is a sequence of steps that is used to render 3D graphics. It is also known as
rendering pipeline.
The given following step:
16) WebGL?
In WebGL, typed array is used to transfer the data element such as index and texture. It stores large quantities of data and process them in to native binary format.
