mecㆍviewer v1.4 :: lecture12.pdf

T&C LAB-AI

Robotics

Computer Graphics and Programming

Lecture 12

GLSL

by extending Ray Tracing

GLSL: OpenGL Shading Language

Jeong-Yean Yang

2020/12/8

T&C LAB-AI

GLSL by Ray Marching

T&C LAB-AI

Robotics

OpenGL Shading Library (GLSL)

• We have learned OpenGL and Ray Tracing

– How to Add Ray Casting or Semi Ray Tracing on OpenGL’s

environment?

– OpenGL is based on Polygon-based Rendering

• Ray Tracing determines Pixel’s Color by calculating color

with respect to

– Normal vector of surfaces
– Light position, reflection, and refraction vector

• OpenGL permits One pixel’s color by GLSL programming

T&C LAB-AI

Robotics

Computational Burden in Ray Tracing

• What is the most Painful works in Ray Tracing?

• Finding Intersection point is complex and slow.

• Sampling becomes the Approximation Technique for

Intersection by fast computation.

 Ray Marching technique is used for OpenGL rendering

Ray Casting

Ray

Ray Tracing

Object

Color

Ray

Reflection

Refraction

T&C LAB-AI

Robotics

Ray Marching for Volumetric Rendering

• OpenGL uses Z buffer for Volume Rendering

• Z buffering projects all data onto one scene image

• Rendering requires volumetric operation

Z=1

Z=-1

Perspective Mapping

Scene

Z=1

Z=-1

Order

Red is above blue

T&C LAB-AI

Robotics

Ray Marching for Fast Speed

• While doing volumetric rendering,

– first sphere s0 meets object B and fills the volume
– Second sphere s1 and s2 meets object B and fill the volume
– Final sphere, s3 meets object A and Calculate Intersection Point
– It is Faster than Ray tracing

Viewpoint

Ray

T&C LAB-AI

GLSL Structure

T&C LAB-AI

Robotics

How to OpenGL calculate One Pixel Color?

 Vertex shader and Fragment Shader

Ref: uGL-39-GLSL-Basic

PhongTex.vsh

PhongTex.fsh

T&C LAB-AI

Robotics

GLSL Architecture

• Script(vsh and fsh) is compiled and uploaded by

uShader class

Vertex Shader

(*.vsh)

Fragment Shader

(*.fsh)

VBO

OpenGL’s

Compiler

GLSL

Program

GPU

Memory

Rendering

Our Program

Vertex Transform

Set Color value

GLSL (vsh, fsh)

uShader

Find RGB

With vsh

and fsh

Pixel Color

T&C LAB-AI

Robotics

App  VSH  FSH

• Our App transfers VBO handle to vsh

– Vertices, normal, and textures.
– Ambient, diffuse, and specular is given to vsh

• VSH file : do transform of vertices and normal.

– Gl’s result = P*H*vertices
– Given color is not used here  pass colors into FSH

• FSH file: do calculation of colors

– VSH provides color and geometry information.
– FSH calculate RGB.

T&C LAB-AI

Robotics

GLSL Basic Variable Types

1. attribute

Connected with VBO

2. varying

Variables in vsh is transferred
to variables in fsh

3. uniform

Connected with my program

T&C LAB-AI

Robotics

GLSL Grammar

• It is similar to C language
• Caution: some variables are very different

– Ex) A= 1  A=1.0
– Ex) vec4 a = vec4(0,0,0,1), a.xyz = vec3(1,2,3)
– Ex) You cannot modify “varying variable”

• varying vec4 diffuse;
• vec4 v = vec4(1,2,3,0);
• diffuse = v  Error
• See example of solid.fsh in “Blue example” of uGL-45-Sphere-

Gouraud-GLSL

• Reference

– https://www.khronos.org/opengl/wiki/Data_Type_(GLSL)#Ve

ctors

T&C LAB-AI

Robotics

APPVSHFSH

Variable Connection

VBO handle

Our App

Screen(P)

Our App

Model(H)

Our App

Color

Our App

VSH

attribute

Vertices,

Normals

textures

uniform

screen

model

uniform

colors

GL’s

Internal

variables

varying

variables

FSH

texture

Our App

uniform

texture

Rendering

varying

variables

T&C LAB-AI

Robotics

See Example uGL-39-GLSL-Basic

attributes in vsh

VSH file

Lecture 9

pp. 26

uVertex uses vertex, normal, and texture, u and v



Three Attributes are defined.

T&C LAB-AI

Robotics

See Example uGL-39-GLSL-Basic

uniform in vsh

uObj::Draw()

uShader::Load()

Our Program

T&C LAB-AI

Robotics

See Example uGL-39-GLSL-Basic

uniform in vsh

uObj::Draw()

uShader::Load()

Our Program

T&C LAB-AI

Robotics

See Example uGL-39-GLSL-Basic

uniform in vsh

uObj::Draw()

uShader::Load()

Our Program

T&C LAB-AI

Robotics

See Example uGL-39-GLSL-Basic

uniform in vsh

screen

model

Perspective

mapping,

H transform

uShader’s

variable

Our App

GLSL in

GPU

T&C LAB-AI

Vertex and Fragment Shader
(VSH and FSH)

T&C LAB-AI

Robotics

Meaning of “screen and model” in vsh

• gl_Position is rendering result on 2D display

– Screen(perspective mapping) is required

• eyePosition(Viewpoint) and normal vector

– need not perspective mapping(screen)

Cam.P

model

screen

object

T&C LAB-AI

Robotics

Vertex shader

Vs.

Fragment shader

• VSH for only Transform

– Bypassing Our App’s parameter into FSH
– APP  VSH  FSH

• VSH is not so unique in many examples

• FSH is designed to calculate Each Pixel Color

• Keep it in your mind

– VSH and FSH are Not for Objects,
– But for Each Pixel Color of objects

T&C LAB-AI

Robotics

App, VBO, VSH, and FSH

Connection Diagram

App

VSH

FSH

VBO

Position,

normal,

Texture

texture

varying

uniform

attribute

P, H, color

position, normal, color

uniform

T&C LAB-AI

Robotics

FSH EX1) uGL-02-Polygon-Color

solid.vsh and solid.fsh

Solid.vsh

Solid.fsh

result

uObj.cpp

T&C LAB-AI

Robotics

FSH Ex2) uGL-03-Object-Camera

solid.vsh and solid.fsh

Solid.vsh

T&C LAB-AI

Robotics

Lambertian Diffuse and

Phong’s Specular Effect

FSH Ex 3) uGL-10-uWnd-Box-Gouraud

Solid.vsh

Solid.fsh

T&C LAB-AI

Robotics

Whenever OpenGL draws one pixel,

GLSL(Vsh and Fsh) is called by GPU

• As a result,
• eyePosition by model*vertices is considered as

“Intersection Point” by the Ray from viewpoint(0,0,0)

Solid.vsh

OpenGL calculates intersection

point for painting as in Ray Tracing

T&C LAB-AI

Robotics

Think as in Ray Tracing,

Can you Read it Now?

ˆn

surface

ˆi



ˆr

camera

ˆ : Illumination(light source)

ˆ : Reflection

ˆ :

n normal

ˆv

T&C LAB-AI

Robotics

Think as in Ray Tracing,

Can you Read it Now?

ˆn

surface

ˆi



ˆr

camera

ˆ : Illumination(light source)

ˆ : Reflection

ˆ :

n normal

ˆv

Light source

L i



T&C LAB-AI

Robotics

Lambertian Dot Product for Diffuse

ˆn

surface

ˆi



ˆr

camera

ˆ : Illumination(light source)

ˆ : Reflection

ˆ :

n normal

ˆv

ˆ ˆ

cos

i n

 

T&C LAB-AI

Robotics

Lambertian Dot Product for Diffuse

ˆn

surface

ˆi



ˆr

camera

ˆ : Illumination(light source)

ˆ : Reflection

ˆ :

n normal

ˆv

cos

0 : Hidden surface

 

T&C LAB-AI

Robotics

Phong’s Specular Color with Reflected Vector

ˆn

surface

ˆi



ˆr

camera

ˆ : Illumination(light source)

ˆ : Reflection

ˆ :

n normal

ˆv

If It is Not a Hidden surface

the Ray from viewpoint(0,0,0)

T&C LAB-AI

Robotics

ˆn

surface

ˆi



ˆr

camera

ˆ : Illumination(light source)

ˆ : Reflection

ˆ :

n normal

ˆv

If It is Not a Hidden surface

the Ray from viewpoint(0,0,0)

ˆ ˆ

cos

r v

 

S( )

cos







Phong’s Specular Color with Reflected Vector

T&C LAB-AI

Robotics

ˆn

surface

ˆi



ˆr

camera

ˆ : Illumination(light source)

ˆ : Reflection

ˆ :

n normal

ˆv

Phong’s Specular Color with Reflected Vector

Color = ambient + diffuse * cos(q) + specular * pow(angle,100)

T&C LAB-AI

Robotics

Ex4) uGL-40-GLSL-Box-Gouraud

Two types of Diffuse

Control

diffuse by

GLSL

T&C LAB-AI

Robotics

Ex5) uGL-40-GLSL-Box-Gouraud

Ambient Effect

Basic Type

Q: Why lower ambient becomes darker?

T&C LAB-AI

Robotics

Ex6) uGL-40-GLSL-Box-Gouraud

More Specular by Power and by Factor

Pow by 100

Pow by 1000

Specular * 5.0

Specular * 1.0

Pow by 100

T&C LAB-AI

Robotics

Simple Cartoon Rendering

• Game with Oriental ink painting

T&C LAB-AI

Robotics

Edge is Over colored using Dot Product

ex)uGL-41-GLSL-Dog-Rendering

View point

(light source)

ˆn

ˆv

Black

color

L 0

cos

n L



 



T&C LAB-AI

Robotics

Ex.7) uGL-41-GLSL-Dog-Rendering

Cartoon-Rendering

L 0

cos

n L



 



View point

75deg

cos

0.25

 

Alpha = 1-dot

66.4 deg

cos

0.4

 

Alpha = 0.9