Post on 09-Jul-2020
Knowledge Aided
Engineering Manufacturing
and Related
Technologies
Computer Graphics Michele Antolini michele.antolini@mail.polimi.it 09/03/2012
KAEMaRT Michele ANTOLINI
Prime applicazioni di computer graphics
Sketchpad • 1963 - Ivan Sutherland
sviluppa una delle prime GUI (Graphical User Interface) utilizzando un plotter 2D e una penna luminosa, sviluppando il concetto innovativo di oggetti e istanze
KAEMaRT Michele ANTOLINI
Prime applicazioni di computer graphics
Sketchpad • La tesi di dottorato di
Sutherland è stata la base per i moderni software per il Computer Aided Design (CAD), per la programmazione object oriented e, in generale, per le Graphical User Interfaces (GUI)
KAEMaRT Michele ANTOLINI
Sketchpad AN INTRODUCTORY EXAMPLE 23
Figure 1.5: (Originally on page 15.)
• I segmenti sono congiunti per via di un vincolo matematico
• Non hanno semplicemente le stesse coordinate numeriche!
• Basi della modellazione parametrica (oltre gli scopi del corso)
KAEMaRT Michele ANTOLINI
Sketchpad AN INTRODUCTORY EXAMPLE 23
Figure 1.5: (Originally on page 15.)
KAEMaRT Michele ANTOLINI
Sketchpad
AN INTRODUCTORY EXAMPLE 23
Figure 1.5: (Originally on page 15.)
KAEMaRT Michele ANTOLINI
Sketchpad
AN INTRODUCTORY EXAMPLE 23
Figure 1.5: (Originally on page 15.)
KAEMaRT Michele ANTOLINI
Sketchpad
AN INTRODUCTORY EXAMPLE 23
Figure 1.5: (Originally on page 15.)
KAEMaRT Michele ANTOLINI
Sketchpad
AN INTRODUCTORY EXAMPLE 23
Figure 1.5: (Originally on page 15.)
KAEMaRT Michele ANTOLINI
Sketchpad
AN INTRODUCTORY EXAMPLE 23
Figure 1.5: (Originally on page 15.)
KAEMaRT Michele ANTOLINI
Sketchpad
AN INTRODUCTORY EXAMPLE 23
Figure 1.5: (Originally on page 15.)
KAEMaRT Michele ANTOLINI
Sketchpad
• Sketchpad si può inoltre considerare il primo esempio di software per la gra!ca vettoriale (vector graphics)
• La tesi di Sutherland è disponibile online all'indirizzo:
http://www.cl.cam.ac.uk/techreports/UCAM-CL-TR-574.pdf
• Biogra!a di Ivan Sutherland
http://en.wikipedia.org/wiki/Ivan_Sutherland
KAEMaRT Michele ANTOLINI
Gra!ca 2D
• La gra!ca 2D si de!nisce generalmente come generazione di immagini digitali basata su calcolatore
• Rappresenta generalmente modelli geometrici (2D), testo, immagini digitali
• Si divide in: • Pixel Art: ogni immagine visualizzata è concepita come un insieme
(ordinato) di punti (detti pixel, da picture element). Ogni manipolazione modi!ca il colore di pixel speci!ci. Un'immagine de!nita come griglia di punti si de!nisce raster graphics.
• Gra!ca Vettoriale: le immagini sono generate a partire da primitive geometriche come punti, linee, curve, poligoni, basandosi su funzioni matematiche
KAEMaRT Michele ANTOLINI
Raster vs Vector
Fonte: Wikipedia
KAEMaRT Michele ANTOLINI
Gra!ca 2D
• Pixel: un pixel è la più piccola unità rappresentabile su uno schermo
• Immagine: un’immagine è un oggetto bidimensionale formato da un insieme ordinato (per righe e per colonne) di pixel
KAEMaRT Michele ANTOLINI
Gra!ca 2D
• Rasterizzazione: la rasterizzazione è un’operazione che permette di trasformare gra!ca vettoriale (descritta matematicamente) in un’immagine
• Ad ogni pixel viene associato un colore
KAEMaRT Michele ANTOLINI
Gra!ca 3D
• Tassellazione: si può considerare l’equivalente 3D della rasterizzazione.
• Dalla rappresentazione matematica di un elemento (segmento, curva, super!cie) se ne genera un’approssimazione formata da triangoli
KAEMaRT Michele ANTOLINI
Gra!ca 3D
• Le applicazioni della gra!ca 3D si basano sulla rappresentazione tridimensionale di funzioni geometriche (punti, linee, curve, super!ci, solidi) e ne forniscono la rappresentazione su schermo tramite proiezioni bidimensionali, dette rendering
• Rendering: processo di generazione di un'immagine a partire da un modello tridimensionale
• Per effettuare l'operazione è necessario speci!care: • Geometria • Punto di vista e !eld of view (FOV) • Texture (letteralmente “tessuto”) • Illuminazione • Shading (letteralmente “ombreggiatura”)
KAEMaRT Michele ANTOLINI
PROIEZIONE PROSPETTICA
KAEMaRT Michele ANTOLINI
Proiezione prospettica
• Frustum: solido troncato da due piani paralleli.
• Si utilizza la de!nizione di una piramide a base quadrata e dei piani near e far per racchiudere la scena visibile dal punto di vista dell’utente (posto all’apice della piramide) e proiettarla in una !nestra (viewport) di dimensioni speci!cate (top, bottom, left, right)
KAEMaRT Michele ANTOLINI
Proiezione prospettica / 2
• Frustum: solido troncato da due piani paralleli.
• Si può de!nire il volume di rendering speci!cando le dimensioni della viewport (width e height), le distanze near e far e l’angolo coperto dal campo visivo lungo l’asse Y ( Field Of View Y)
KAEMaRT Michele ANTOLINI
Proiezione ortogonale parallela
• La proiezione ortogonale di una scena racchiusa in un parallelepipedo ha la caratteristica di conservare il parallelismo delle rette indipendentemente dal punto di vista
KAEMaRT Michele ANTOLINI
Rendering
• De!nendo geometria, punto di vista e campo visivo è possibile proiettare la scena 3D su un piano per calcolarne la rasterizzazione
Centro di proiezione
A
B A’
B’
Piano di proiezione
KAEMaRT Michele ANTOLINI
TEXTURE MAPPING
KAEMaRT Michele ANTOLINI
Texture mapping
• Applicazione di un’immagine bidimensionale (detta texture) sulla super!cie di un oggetto 3D.
KAEMaRT Michele ANTOLINI
Texture mapping
• Applicare una texture signi!ca generare una corrispondenza tra un punto su una super!cie 3D ed un altro su un’immagine bidimensionale
• Non esiste un modo univoco per risolvere il problema
http://www.siggraph.org/education/materials/HyperGraph/hypergraph.htm
KAEMaRT Michele ANTOLINI
Texture mapping
• È possibile mappare, ad esempio, le coordinate parametriche (u,v) di una super!cie con le coordinate della texture (normalizzati tra 0 e 1)
http://www.siggraph.org/education/materials/HyperGraph/hypergraph.htm
KAEMaRT Michele ANTOLINI
Texture mapping
• Utilizzando una mappatura non lineare è possibile ottenere diversi effetti
http://www.siggraph.org/education/materials/HyperGraph/hypergraph.htm
KAEMaRT Michele ANTOLINI
Texture mapping - Proiezione
http://www.siggraph.org/education/materials/HyperGraph/hypergraph.htm
• Un’altra tecnica si basa invece sulla proiezione della geometria su un piano
KAEMaRT Michele ANTOLINI
Texture mapping - Proiezione
http://www.siggraph.org/education/materials/HyperGraph/hypergraph.htm
• La coordinata ortogonale al piano di proiezione viene ignorata durante l’applicazione della texture
KAEMaRT Michele ANTOLINI
Texture mapping – Cylinder mapping
http://www.siggraph.org/education/materials/HyperGraph/hypergraph.htm
• Chiusura della texture su sé stessa (a formare un cilindro) e trasformazione delle coordinate x,y,z in coordinate cilindriche ( r, theta, altezza)
KAEMaRT Michele ANTOLINI
Texture mapping – Cylinder mapping
http://www.siggraph.org/education/materials/HyperGraph/hypergraph.htm
• Dopo la trasformazione in coordinate cilindriche, la r viene ignorata (tutti i punti della geometria con uguali theta e altezza hanno lo stesso colore)
KAEMaRT Michele ANTOLINI
Texture mapping – Cylinder mapping
http://www.siggraph.org/education/materials/HyperGraph/hypergraph.htm
• Dopo la trasformazione in coordinate cilindriche, la r viene ignorata (tutti i punti della geometria con uguali theta e altezza hanno lo stesso colore)
KAEMaRT Michele ANTOLINI
Texture mapping – Sphere mapping
http://www.siggraph.org/education/materials/HyperGraph/hypergraph.htm
• Inscrizione della geometria all’interno di una sfera e proiezione della texture
KAEMaRT Michele ANTOLINI
Texture mapping – Cube mapping
http://www.siggraph.org/education/materials/HyperGraph/hypergraph.htm
• Il cube mapping necessita di 6 immagini, corrispondenti alle sei facce di un cubo che circonda la geometria
KAEMaRT Michele ANTOLINI
Texture mapping – Cube mapping
http://www.siggraph.org/education/materials/HyperGraph/hypergraph.htm
• Insieme allo sphere mapping, il cube mapping è la tecnica più utilizzata per risolvere il problema dell’environment mapping ed è sfruttata massivamente nei giochi
KAEMaRT Michele ANTOLINI
Bump mapping
• Il bump mapping permette di aumentare il livello di dettaglio di una scena senza aggiungere complessità alle geometrie
• La tecnica si basa sull’interpretazione di una texture (solitamente in scala di grigi) applicata ad un oggetto per generare sporgenze, solchi o rugosità.
• La corrispondenza tra il livello di grigio e l’entità del solco o della sporgenza è de!nito dall’utente al momento dell’applicazione della texture.
KAEMaRT Michele ANTOLINI
Bump mapping
• L’utilizzo del bump mapping permette di calcolare l’ombreggiatura di un oggetto ma non ne cambia la geometria
• Nell’immagine di esempio, infatti, la sagoma delle sfere non viene in#uenzata dalla presenza di solchi
KAEMaRT Michele ANTOLINI
SHADING
KAEMaRT Michele ANTOLINI
Shading
• Lo shading è l'operazione che permette, dato il colore di una super!cie o di una faccia di un poligono, di calcolarne l'ombreggiatura in base alla direzione della luce (partendo dalla posizione della sorgente luminosa).
• Flat shading: assegnazione di una tonalità di colore per ogni faccia dei poligoni contenuti nella scena
• Smooth shading: per ogni pixel dell'immagine rasterizzata, la tonalità di colore dipende dall'interpolazione dei vettori normali alle facce del poligono. I diversi algoritmi di smooth shading si differenziano in base al metodo di interpolazione dei vettori normali.
KAEMaRT Michele ANTOLINI
Shading
FLAT SHADING SMOOTH SHADING (Gouraud e Phong)
KAEMaRT Michele ANTOLINI
Shading
• Oltre agli algoritmi di shading prede!niti, è possibile programmare algoritmi personalizzati da far eseguire direttamente dalla scheda gra!ca
• Questa funzionalità rende possibile la de!nizione di materiali complessi al !ne di ottenere effetti fotorealistici
• Il massimo grado di fotorealismo è raggiunto da algoritmi di raytracing, che simulano il comportamento dei fotoni emessi da una sorgente luminosa
KAEMaRT Michele ANTOLINI
Realistic rendering
http://www.realtime-technology.com
KAEMaRT Michele ANTOLINI
Realistic rendering
http://www.nvidia.com
KAEMaRT Michele ANTOLINI
Computer Gra!ca
• I programmi di gra!ca (non solo 3D) hanno una struttura molto simile
• Fasi: • De!nizione geometrie (vertici, vettori, linee, poligoni,
curve, super!ci, volumi) • De!nizione punto di vista, FOV, proiezione • Tassellazione, shading (+ eventuali texture)
• Sono coinvolti vettori, matrici, equazioni matematiche
KAEMaRT Michele ANTOLINI
FASI STORICHE
KAEMaRT Michele ANTOLINI
Software -> Hardware
• Anni ‘80: Presenza di algoritmi maturi per le operazioni 3D (la tesi di Sutherland è del 1963)
• Necessità di applicare ad un grande numero di dati le medesime operazioni
• 1984: la IBM rilascia il primo tentativo di scheda per PC dedicata all'accelerazione hardware 2D/3D (con un processore 8088-2, 8MHz)
• Negli anni '90 l'accelerazione 2D prima e 3D poi diventano sempre più importanti per le prestazioni dei computer, così società come S3, ATI, Matrox cominciano a produrre schede di accelerazione hardware sempre più performanti
KAEMaRT Michele ANTOLINI
OpenGL
• 1992: la Silicon Graphics sviluppa una speci!ca per disegnare scene tridimensionali a partire da chiamate a funzioni primitive
• Si tratta della prima de!nizione di Open Graphics Library (OpenGL)
• De!nita come interfaccia: i costruttori implementano le funzioni in base allo speci!co hardware sottostante
• 2007: il controllo dell’interfaccia OpenGL passa al consorzio Khronos Group
KAEMaRT Michele ANTOLINI
OpenGL
• È una speci!ca, un insieme di API (de!nizione dei punti di ingresso per la programmazione)
• Non è legata ad hardware speci!co, le funzionalità sono modellate in maniera astratta
• È uno standard aperto e ne esistono implementazioni per diversi sistemi operativi (anche di tipo mobile (iPhone, Android, Symbian)
KAEMaRT Michele ANTOLINI
OpenGL
• Implementazioni software di funzioni non supportate dall’hardware
• Sfruttamento delle capacità dei diversi acceleratori 3D
• L’interfaccia si è evoluta nel tempo, ma la !loso!a iniziale non è mai cambiata (es. principio della macchina a stati, astrazione dalle funzionalità hardware)
KAEMaRT Michele ANTOLINI
OpenGL - Date
• 1992: OpenGL 1.0 • 1997 (gennaio): OpenGL 1.1, texture su GPU • 1998-2003 OpenGL viene aggiornato più o meno
annualmente • 2004: OpenGL 2.0, shaders programmabili (GLSL, OpenGL
Shading Language) • 2008: OpenGL 3.0, geometry shader, vertex array (tra le
altre cose) • 2010 (11 marzo) OpenGL 4.0:
• tassellazione • virgola mobile a 64bit (doppia precisione) per gli shader • supporto OpenCL (GPGPU) per lo sfruttamento della GPU per General
Purpose computing
KAEMaRT Michele ANTOLINI
OpenGL
• L’interfaccia OpenGL ha portato nel tempo ad una convergenza nell’architettura hardware delle schede gra!che
• Nelle schede gra!che attuali, sezioni speci!che si occupano della gestione di:
• punti, linee, poligoni (primitive base)
• Generazione e tassellazione di curve e super!ci parametriche
• pipeline per trasformazioni e illuminazione
• Z-buffering
• Texture mapping
• Alpha blending
KAEMaRT Michele ANTOLINI
OpenGL
• OpenGL non si occupa di: • event management • input management (tastiera/mouse) • window management
• L’ambiente di sviluppo per OpenGL è normalmente costituito da alcune librerie: • gl OpenGL • glu GL Utilities • gl<ws> Estensione per <ws> (window system) • glut Interfaccia a <ws>
KAEMaRT Michele ANTOLINI
OpenGL
• rendering 3D • lighting • z-buffering • alpha blending • applicazione texture • antialiasing • fog
Libreria gl
KAEMaRT Michele ANTOLINI
OpenGL
• gestione parametri viewing • gestione texture mapping • polygon tessellation (decompositore generico
di poligoni concavi) • curve e super!ci parametriche • gestione errori
Libreria glu
KAEMaRT Michele ANTOLINI
OpenGL
• interfaccia con il window system • gestione eventi • gestione input keyboard/mouse • primitive 3D • realizza trasparenza rispetto al window
system sottostante
Libreria glut
KAEMaRT Michele ANTOLINI
Direct3D
• Parte delle DirectX (interfaccia per la gestione della multimedialità e delle periferiche di gioco per MS Windows)
• Interfaccia proprietaria, sviluppata da Microsoft e implementata solo per sistemi Microsoft
• Estremamente legata all’hardware e alle funzionalità fornite dalle schede gra!che
• Per ogni versione, la backward compatibility è difficilmente garantita
• Dalla versione 9 in poi le prestazioni sono molto elevate e l’architettura è diventata matura
• Maggiore sfruttamento dell’hardware sottostante a discapito della compatibilità
KAEMaRT Michele ANTOLINI
GPU
• Le schede gra!che (GPU) non sono più “semplici” rasterizer ma gestiscono luci, texture e shading
• Negli anni 2000 i produttori di GPU forniscono gli strumenti per programmare direttamente sull’hardware gli algoritmi di shading
• Ogni vertice della geometria ed ogni pixel rasterizzato vengono processati da un programma residente sulla GPU che può includere texture aggiuntive o altri tipi di input
KAEMaRT Michele ANTOLINI
Shaders
• I primi shaders erano de!niti direttamente nell’hardware della scheda video (!at e smooth shaders)
• Prima di OpenGL 2.0, alcune schede gra!che erano programmabili in linguaggio assembler, il cui codice binario doveva essere copiato sulla scheda
• Con OpenGL 2.0 è stato de!nito un linguaggio di programmazione per shaders, il GLSL (OpenGL Shading Language)
KAEMaRT Michele ANTOLINI
Shaders
• Le schede gra!che diventano una logica programmabile
• Il consorzio OpenGL ARB (Architecture Review Board) detta le speci!che per il linguaggio di alto livello (simile al C) con cui programmare le schede
• Il compilatore è integrato nei driver OpenGL (se compatibile 2.0) di ogni scheda, quindi ottimizzato a seconda dell’hardware sottostante
KAEMaRT Michele ANTOLINI
Shaders
• Gli shaders seguono il paradigma di programmazione de!nito stream processing
• La GPU permette centinaia, migliaia di operazioni contemporanee su dati multipli: Single Instruction Multiple Data (SIMD)
• Uno shader è un vero e proprio programma che sfrutta le capacità di calcolo parallelo della GPU
KAEMaRT Michele ANTOLINI
GLSL
• Il consorzio OpenGL ARB ha de!nito un linguaggio standard di alto livello per la programmazione di shaders
• Sono stati tenuti in considerazione molti requisiti: • Buona integrazione con speci!che OpenGL • Possibilità di sfruttamento di hardware futuro • Indipendenza dall’hardware sottostante • Semplicità e longevità • Compatibilità con calcolo parallelo massivo
KAEMaRT Michele ANTOLINI
GLSL
• Gli shaders si dividono in vertex shaders e fragment shaders
• Sono solitamente associati tra di loro • Il vertex shader è l’algoritmo che viene richiamato per
ogni vertice risultante dalla tassellazione e gestisce le caratteristiche del modello
• Il fragment shader (o pixel shader) viene richiamato per ogni pixel dell’immagine e gestisce texture e bump mapping
KAEMaRT Michele ANTOLINI
GLSL - Esempi
KAEMaRT Michele ANTOLINI
GLSL - Esempi
Toon Shader
KAEMaRT Michele ANTOLINI
GLSL - Esempi
Shader Animati (i calcoli vengono eseguiti dalla GPU)
KAEMaRT Michele ANTOLINI
GLSL - Esempi
Shader Animati (i calcoli vengono eseguiti dalla GPU)
KAEMaRT Michele ANTOLINI
GLSL - Esempi
Effetti particellari (le traiettorie delle particelle sono calcolati in parallelo dalla GPU)
KAEMaRT Michele ANTOLINI
GPGPU
• Le schede gra!che odierne non si occupano più solo di gra!ca
• La programmabilità e la capacità di eseguire calcoli complessi da applicare ad un gran numero di dati in contemporanea (alto parallelismo a livello hardware) fa preferire l’esecuzione di alcuni algoritmi su GPU piuttosto che su CPU
• Questa tecnica si de!nisce General Purpose (Computing) on GPU (GPGPU)
• Esistono numerose applicazioni in grado di sfruttare la GPU, non solo di tipo scienti!co, ma anche programmi di gra!ca come Photoshop parti del sistema operativo Mac OSX Snow Leopard
• Esistono anche diverse implementazioni di encoder/decoder audio/video che, sfruttando la GPU, riescono ad incrementare le prestazioni anche di 20 volte rispetto alle implementazioni per CPU
KAEMaRT Michele ANTOLINI
Librerie per GPGPU
Le principali librerie che permettono l’esecuzione di codice su GPU sono:
• OpenCL (standard utilizzato dal sistema operativo Snow Leopard )
• CUDA (sviluppato per le schede Nvidia)
• Stream (sviluppato per le schede Ati)
KAEMaRT Michele ANTOLINI
LET’S START Un po’ di teoria adesso!