Please enable JavaScript.

Coggle requires JavaScript to display documents.

Computer Graphics - OpenGL, SDL., Graphics spaces, Camera, (GLuint…

- - - - Where you put the cameras (in what coordinates).
- - - - Fragment shader
        
        Concept
        
        Characteristics
        
        Handles data for each fragment.
        
        Goes through every fragment you've got, each individual pixel and it will perform an operation on that.
        
        Place where you can choose to output the color of that pixel.
        
        Place where you handle all of the lightning of the program, texturing, shadows, etc.
        
        Optional
        
        Usually only has one output.
        
        If you were to output a texture on the geometry shader, you could "catch it" here with the in keyword.
        
        Example shader
        
        Line 1
        
        Shader version needs to match OpenGL version and the same version as the other shaders.
        
        Line 3
        
        Indicates the output of the shader of type vec4
        
        Line 7
        
        Here we are putting the red color with its RGB values and also full opacity.
      - Geometry shader
        
        Concept
        
        Characteristics
        
        Handles groups of vertices (primitives)
        Unlike vertex shaders that handle vertices one at a time.
        
        Takes a primitive and "emits"/outputs its' vertices to create this primitive, or even a new one.
        For example, takes a square primitive and outputs the vertices of the square.
        
        You can duplicate primitives.
        
        Can convert primitives into other stuff, like other primitives or even lines, etc.
      - Tessellation
        
        Concept
        
        Characteristics
        
        Can be used to add higher levels of detail dinamically.
        
        Allows to divide data into smaller primitives.
      - Vertex shader
        
        Concept
        
        Characteristics
        
        Defining the shader is mandatory
        
        Programs are created with at least a vertex shader and then are activated before use.
        
        Handles vertices individually
        
        Must store something in the variable gl_Position
        
        For each vertex, you can pass data down the pipeline into the fragment shader.
        
        Steps #
        
        Define the version of GLSL that you're using.
        
        Define location of the layout
        
        Explanation
        
        Defining the location of the layout inside the shader by giving it an ID so it's easier to access later in the code.
        
        Example Program
        
        Line 3
        
        in means there's an input.
        Program expects for you to pass data.
        
        vec 3 means it's a vector consisting of 3 values.
        In this case, vec3 is an x, y, z point because of the pos variable name.
        
        pos is the name of the variable
        
        Line 7
        
        gl_Position requires a vec4 value (vector with 4 values)
        
        Creating a vector4 by passing the position vector and the 4th value.
    - - Primitive Assembly
        
        Concept
        
        Here everything that has been defined mathematically will be assembeled.
        For example, if you are rendering triangles and you have defined 6 vertices, the vertices would become 2 triangles in this phase.
        
        Face culling
        
        This is the removal of sides of primitives that the user can't see. In other words, the sides that are facing away from the user, from the POV.
        
        It makes sure that the sides do not get drawed.
      - Rasterization
        
        Concept
        
        It's the process of converting 3D objects or vector images into a pixel format that is more suitable for computers to display the graphics on the screen. It converts primitives into a grid of pixels, where each pixel represents a specific color or shade.
        
        Characteristics
        
        Converts primitives into fragments.
        
        Divides the vector image or 3D object into a grid of pixels.
        
        Determines which primitives intersects with each pixel.
        
        Calculates the color or intensity of each pixel basing it on the properties of the primitives that are intersecting.
        Some possible properties are: color, texture, lightning and transparency.
      - Per-sample operations
        
        Concept
        
        Series of test-runs to check if the fragment should be drawn on the screen. Might be a waste to draw it, even if we have all the data for it.
        
        Characteristics
        
        Test depth. It tests the depth of the fragments.
        For example, if we want to draw 2 triangles on the same screen and on the same place, it will check the depth of each triangle and it won't draw the parts that are behind the first triangle, because if you can't see it, you shouldn't bother drawing it.
        
        Color blending.
        Good to create transparency effects, ej. windows.
        
        After doing all of these tests it will write the fragment data to the Framebuffer that is currently bound. (This one is usually the default one).
        
        Double buffering. When there are two buffers, one that the user sees and one that the user can't see. The idea is that you draw new information to the hidden buffer and then swap it out for the visible buffer.
        You can also create more buffers that don't have to be in this cycle and then you can create a scene in this new buffer and attach a texture to it. This allows for very cool features.
      - Vertex Post-Processing
        
        Concept
        
        Characteristics
        
        Stages
        
        Transform Feedback (if enabled)
        
        Concept
        
        Vertex and geometry stages output some values and layouts.
        Instead of going through the geometry and vertex stages every single time, you can save those values on a buffer and skip half of the rendering pipeline.
        This improves performance.
        
        Clipping
        
        Characteristics
        
        Removes primitives that are not visible to the user.
        Avoiding making calculations and drawing things the user can't see.
        
        Positions get converted from the "clip-space" to "window-space"
      - Vertex Specification
        
        Concept
        
        Sets up and prepares the vertices of the primitives that are going to be rendered by the pipeline. It defines the shape.
        
        Things
        
        VAO (Vertex array object)
        
        Concept
        
        It says what that data the vertex has.
        Stores RGB values, coordinates, etc.
        
        Colour
        
        Texture
        
        Normals
        
        Position
        
        Characteristics
        
        This data gets stored in the graphics card
        
        VBO (Vertex buffer object)
        
        Concept
        
        Defines the data itself.
        
        Characteristics
        
        Can have multiple VBOs attached to a VAO
        
        This data gets stored in the graphics card
        
        Attribute Pointers
        
        Concept
        
        They define where and how shaders can access vertex data.
        
        Characteristics
        
        Way to connect VAOs and VBOs to shaders
        
        Step by Step - How to create VAO and VBO
        
        Generate a VBO ID
        
        Bind VBO with ID
        
        Define Attribute Pointer Formatting
        
        Define how the actual data in the VBO is formatted:
        Groups of three?
        Spaced apart?
        Integers?
        Floats?
        
        Bind the VAO with ID
        
        You indicate to the GPU which VAO you want to work with.
        
        Because you bound the VAO first, OpenGL will assume that the VBO will be using the configurations of this VAO. (until you unbind the VAO). Some people like to indent their code here.
        
        Enable the Attribute Pointer
        
        Done so the shader can access the pointer formatting.
        
        Generate a VAO ID
        
        When you create a VAO, the system allocates a bunch of memory for the data of that VAO.
        But you can't access that data directly, so you need an ID to query the GPU and get access to the data.
        
        Unbind the VBO and VAO
        
        Get ready for the next object you want to bind.
        For example, if you have created a square and want to create a triangle, you now have to unbind the VAO and VBO of the square and repeat this process with the triangle.
        
        Attach Vertex data to that VBO
        
        Initiating the Drawing/Pipeline
        
        Steps
        
        Bind the VAO of the object you want to draw
        
        Call glDrawArrays
        
        Explanation
        
        Initiates the pipeline process
        
        Activate the Shader Program you want to use
        
        Explanation
        
        Pick the shader you want to use (vertex code, fragment code, geometry shader code, etc.)
        
        Characteristics
        
        Starts the pipeline
  - - - Concept
        
        Groups of vertices that make a simple shape(usually a triangle)
    - - Concept
        
        It's a point in space usually defined by a user with x, y and z coordinates.
    - - Concept
        
        Piece of data for each pixel that is obtained from the rasterization process.
        
        Pieces of data necessary to generate a single pixel's worth of a primitive that is being drawed on the screen on the frame buffer.
    - - Concept
        
        The value that goes inside is assumed to be the final position of a vertex.
  - - - What are primitives?
      - What is a vertex in a computer graphics context?
      - What is a fragment?
      - What's the function of each stage of the Rendering Pipeline, what caracterizes each stage?
      - What is the rendering pipeline and what does it do?
      - What is a VAO and VBO and in what stage are they contained?
      - What are attribute pointers, what stage are they usually related to?
      - How do you create a VAO and VBO, what are the steps?
      - How do you initialize the first stage of the rendering pipeline?
      - What are the stages of the Rendering Pipeline ordered?
      - What do you need to do to create and code a vertex shader. What code do you need to make to create a simple program?
      - What are the two substages of the 5th stage of the Rendering Pipeline.
      - How do you write a Fragment Shader, what do you need to do to create a simple shader program?
- - - - Notes
        
        Based on C language
  - - - Combination of many shaders that are connected to one another and will be drawn in a single call through the pipeline.
        One shader program could consist of a Vertex, Tessellation, Geometry and Fragment shader, associated to one another. When we do the call in the rendering pipeline, every shader gets used.
    - - They are created in OpenGL with a series of functions.
      - We can switch between shader programs which has different shaders and properties.
    - - Attach the shader source code to the individual shaders
      - Compile the data for the shaders
      - Create empty shaders
        
        ...
        
        Create the individual shaders, for example the Vertex Shader and Fragment Shader.
      - Attach the shaders to the program
        
        ...
        
        Attach the compiled data to the program
      - Create an empty program
      - Link the program
        
        ...
        
        Creates executables from shaders and links them together. (Similar to .exe, but no exactly that)
      - Validate the program (optional but recommended)
        
        ...
        
        Checking that everything is actually working, no bugs, no unexpected weird stuff, no syntax errors.
    - - ...
        
        When you create a shader, it outputs the ID of the shader.
        
        You can use glUseProgram(0) to reset/switch-off the shader program and make sure that nothing accidentally gets drawn to the screen with the wrong shader.
      - How to.
        
        Call glUseProgram(ShaderID)
        After calling this, every draw that happens will be using this shader program.
- - - - Concept
        
        Like the sun, very broad and general.
    - - Concept
        
        Just a point of light that is like a minecraft torch.
    - - Concept
        
        Horror game light. Kind of like the phone torch.
- - - - Multidimensional arrays that hold data about coordinates and space and direction of a vector.
  - - - "Point A to point B"
      - Places in space
- - - - SDL
        
        SDL_Init()
        
        SDL_Init() initializes the SDL library.
        
        SDL_Init() returns a negative number if the function has an error.
        
        The parameter SDL_INIT_VIDEO indicates that it wants to initiate the video subsystem of SDL.
        
        SDL_Log()
        
        Logs a message if there was an error.
      - GLEW
      - OpenGL
    - - Shader code
        
        Fragment shader
        
        Line 19
        
        Creates a variable FragColor (Fragment color) of the type vec4 and "exports" it so it can be intercepted by another shader with the in keyword.
        
        Line 22
        
        Sets the value of FragColor to a vec4 variable type with the RGBA values of the red color.
        
        Vertex Shader
        
        Line 9
        
        Sets the layout location ID to 0 and creates variable aPos of type vec3.
        
        Line 12
        
        Sets the gl_Position variable to a vector of type 4 that takes as argument the coordinates of aPos and a second value.
        
        Line 8
        
        Sets the version of the shader, which has to be the same in every shader of the program and has to be the same version as the OpenGL version you defined in the code.
      - Error checking
        
        Explanation
        
        Line by Line Explanation
        
        Line 29
        
        Gets the status of the compilation of the shader.
        
        Line 28
        
        Creates an array of GLchar with 512 available characters.
        
        Line
        
        Broad Explanation
        
        Questions that pop-up
        
        How does the glGetShaderiv method work.
      - Shader program
    - - Code
        
        Line 103 & 104
        
        Creates the VAO and VBO and assigns an ID to each one. This is done because both objects are managed by the GPU and they need the ID for tracking.
        It uses the & because the program needs to modify the variables VAO and VBO. The function needs the address to do that. If it didn't have an &, it would just pass the copy of the variable and they would not be modified.
        
        Line 106
        
        It binds the VAO, which makes it the active VAO.
        This means that from now on, every configuration and change related to vertex attributes (like enabling or disabling attributes) will be stored on this VAO.
        This allows you to switch between different VAO configurations by re-binding them (calling the binding method again with another VAO).
        
        Line 108
        
        It binds the VBO to the GL_ARRAY_BUFFER target.
        This makes the VBO the current active buffer, which allows you to upload data to it.
        
        Line 109
        
        Allocates memory on the GPU and uploads the vertex data to the currently bound GL_ARRAY_BUFFER (i.e. the VBO)
        sizeof(vertices) - Indicates the size in bytes of the vertex data.
        vertices - Passes the array containing the vertex data.
        GL_STATIC_DRAW - Indicates that the data won't change much and it will be used for drawing.
        
        Line 111
        
        It specifies how the vertex data will be laid out and links it to a shader attribute.
        
        (void)0 specifies the offset in the buffer where the vertex data begins. It's how far into the buffer the program should start reading data for this particular attribute.
        Because OpenGL expects a pointer, you put a generic one like void.
        Because it's 0, it means it starts at the very beginning of the buffer, no offset.
        
        3*sizeof(float) indicates the stride, which is the number of bytes in the buffer moved forward needed to get to the next vertex's data. It's 3 because each vertex has 3 float values (in this case: x, y, z)
        
        GL_FALSE indicates that the data shouldn't be normalized. This means that the vertex data (ej. positions)should be passed to the GPU "as it is", without any changes, transformations or scaling.
        
        GL_FLOAT indicates the type of each component.
        
        The 3 indicates that each vertex has 3 components (ej. x, y, z).
        
        The 0 is the index of the vertex attribute that is in the shader. (ej. location 0)
        
        Line 112#
        
        layout(location = 0) in vec3 aPos; // Location 0
        In this code, aPos is the attribute that is receiving the vertex data (positions in this case)
        The location 0 links this shader attribute to the VBO/buffer data
        
        It activates the vertex attribute at location 0. This tells OpenGL: The data stored in this attribute is ready to be used in the vertex shader.
        Location 0 referes to a specific attribute on the shader program.
        
        If you don't put this code, the VBO data that was bound to the GL_ARRAY_BUFFER would not be sent to the vertex shader and OpenGL would ignore the attribute in the rendering phase. #
        
        Line 114
        
        Unbinds the current buffer (i.e. VBO) from the GL_ARRAY_BUFFER target.
        The 0 is a reserved value in OpenGL that means "nothing is found"
        
        This line is needed to prevent weird, accidental modifications to the buffer later on in the program.
        
        Line 115
        
        Unbinds the current VAO and prevents accidental changes later on. This is good practice to avoid any weird things later in the program.
        
        Questions/Curiosity
        
        Why is there an & when creating VAO and VBO?
        
        Answer #
        
        What is that 3 sizeof(float) thing?
        and (void)0
        
        Answer #
        
        Testing myself
        
        What does each piece of code do?
- - - - Camera position in the world space
  - - - Lightning
        
        Panoramic light
        
        ... light
        
        Point Light
    - - Y-axis rotation of the camera.
    - - X-axis rotation of the camera
- - - - Convert a model from clip space to world space.
        
        Model goes from model space to world space
        
        Models/Objects
        
        3D objects that are created in a 3D builder like blender.