introduksjon

20
Lineær algebra med grafiske anvendelser Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1 Side 1 Introduksjon Hva er grafisk databehandling? side 2 Noen eksempler på datagrafikk side 3 Undervisningsopplegg og læremateriell side 4 Introduksjon til OpenGL med Javabinding, JOGL side 5-6 Hva kan OpenGL gjøre: side 7 Basisstrukturen i et OpenGL-program kan være enkel: side 8 OpenGL primitiver: side 9 OpenGL metode-/kommandosyntaks side 10 Datatyper side 11 OpenGL en tilstandsmaskin Tilstandsvariable side 12 Noen tilstandsvariable side 13 OpenGL rendering pipeline side 14-16 Biblioteker relatert til OpenGL side 17-18 Et lite eksempel: side 19-20

Upload: aladdin-reese

Post on 30-Dec-2015

32 views

Category:

Documents


1 download

DESCRIPTION

Hva er grafisk databehandling? side 2 Noen eksempler på datagrafikk side 3 Undervisningsopplegg og læremateriellside 4 Introduksjon til OpenGL med Javabinding, JOGLside 5-6 Hva kan OpenGL gjøre: side 7 Basisstrukturen i et OpenGL-program kan være enkel:side 8 - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: Introduksjon

Lineær algebra med grafiske anvendelser

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen

Leksjon 1Side 1

IntroduksjonHva er grafisk databehandling? side 2Noen eksempler på datagrafikk side 3Undervisningsopplegg og læremateriell side 4Introduksjon til OpenGL med Javabinding, JOGL side 5-6Hva kan OpenGL gjøre: side 7Basisstrukturen i et OpenGL-program kan være enkel: side 8OpenGL primitiver: side 9OpenGL metode-/kommandosyntaks side 10Datatyper side 11OpenGL en tilstandsmaskin Tilstandsvariable side 12Noen tilstandsvariable side 13OpenGL rendering pipeline side 14-16Biblioteker relatert til OpenGL side 17-18Et lite eksempel: side 19-20

Page 2: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 2

Hva er grafisk databehandling?

• Omfatter alle aspekter ved det å produsere tegninger eller syntetiske/virtuelle bilder på en dataskjerm

• Dvs alt fra det å tegne punkter og linjer på en dataskjerm eller et digitalt framvisningsmedium, til virtuelle, nesten fotorealistiske modellbilder av 3D objekter.

• I grafisk databehandling blir de 2D eller 3D-objekter, som skal tegnes ut, først beskrevet ved matematiske modeller. En 3D-dimensjonal terning kan for eksempel modelleres matematisk ved først å definere et tredimensjonalt koordinatsystem med origo og akser med enheter på aksene. Så angies koordinatene til hjørnepunktene på terningen i dette koordinatsystemet.

• Veien fra den matematiske beskrivelsen av objektene/senen (3d-koordinater) til uttegning på en skjerm, rendering, medfører en rekke operasjoner. Ulike grafiske programvaresystemer vil som oftest ha ulike måter å gjøre dette på. I dette faget skal vi benytte det grafiske programvaresystemet OpenGL.

Page 3: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 3

Noen eksempler på datagrafikk

• Web-siden: http://fly.cc.fer.hr/~unreal/theredbook/appendixj.html Fra OpenGL Programming Guide ”The Red Book” Appendix J

Plate 1. The scene from the cover of this book, with the objects rendered as wireframe models.Plate 2. The same scene using fog for depth-cueing (lines further from the eye are dimmer). Plate 3. The same scene with antialiased lines that smooth the jagged edges Plate 4. The scene drawn with flat-shaded polygons (a single color for each filled polygon). Plate 5. The scene rendered with lighting and smooth-shaded polygons. Plate 6. The scene with texture maps and shadows added. Plate 7. The scene drawn with one of the objects motion-blurred. The accumulation buffer is used to compose the sequence of images needed to blur the moving object. Plate 8. A close-up shot - the scene is rendered from a new viewpoint.Plate 9. The scene drawn using atmospheric effects (fog) to simulate a smoke-filled room.

Page 4: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 4

Undervisningsopplegg og læremateriell

• Tre forelesninger: – Introduksjon til grafisk databehandling ved bruk av OpenGl med

Javabinding JOGL

– Transformasjoner

– Farge og lys

• Tre øvinger• Læremateriellet er forelesningene, øvingene og stoff hentet fra nettet:

Se:

..\NyttigeLenker\Nyttige_lenkerGLJOGL.pdf

• En eldre versjon av boka OpenGL Programming Guide ”Red Book”

ligger på nettet. Mesteparten av lærestoffet finnes i deler av kap 1--5.

http://fly.cc.fer.hr/~unreal/theredbook/

Page 5: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 5

Introduksjon til OpenGL med Javabinding, JOGL

OpenGL

1. er etablert som en industristandard og referansestandard for generell 3D grafikk

2. er utviklet av Silicon Graphics.

3. utvikles nå under kontroll av et: Architectural Review Board. Beskrivelse av denne virksomheten finnes på: ARB . Her finnes også linker til beskrivelser, kurs og eksempler.

Det finnes en masse informasjon om OpenGL på nettet. OpenGL er utviklet og beskrevet som en plattformuavhengig pakke og kan kjøres på en rekke plattformer: MS-Windows, Linux, Unix, MacOS, OS/2.

Vi kan benytte OpenGL fra flere programmeringsspråk. Det finnes i dag komplette språkbindinger for i hvert fall C, C++, C#, Fortran og Java.

Page 6: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 6

Introduksjon til OpenGL fortsetter

• OpenGL er et programvaregrensesnitt- mot grafisk hardware(skjerm, printer, grafikkakselerator, .. osv).

• OpenGL består av ca 250 basismetoder/kommandoer som kan benyttes til å spesifisere objekter og operasjoner som er nødvendige for å lage interaktive, 3D grafiske anvendelser

• OpenGL er hardware og plattformuavhengig. ( Kan kjøres på Windows, MAC, Linux, Unix, ..)

• OpenGL innholder opprinnelig ingen kommandoer/metoder for å utføre vindus/skjermoperasjoner eller for å motta brukerinput

• OpenGL tilbyr ingen høy-nivå-kommandoer/metoder for å beskrive modeller av 3D-objekter (glu og glut)

• OpenGL tilbyr kommandoer/metoder for å bygge egne modeller av objekter på grunnlag av et lite sett med geometriske primitiver: (hjørne)punkter, linjer og polygoner

Page 7: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 7

Hva kan OpenGL gjøre:

• Konstruere former/objekter på grunnlag av geometriske primitiver og dermed visualisere matematiske beskrivelser av objektene. (OpenGL betrakter punkter, linjer, polygoner, digitale bilder og bitmaps som primitiver)

• Ordne objekter i 3D-rom og velge betraktningsposisjon og belysning for å se på objektene.

• Beregne fargen på objektene. Fargene kan være eksplisitt gitt av anvendelsen, bestemt av betraktningsbetingelser, eller ved tekstur på objektene, og av kombinasjoner av disse tre beregningsmetodene.

• Omforme de matematiske beskrivelsene av objektene og objektenes tilhørende farger, til pixler på skjermen.

• OpenGL kan også utføre andre operasjoner som for eksempel eliminere skjulte flater, tåkelegge, osv.

Page 8: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 8

Basisstrukturen i et OpenGL-program kan være enkel:

Hovedoppgavene er:• Initiere visse tilstander som kontrollerer hvordan OpenGL

”rendrer”(render) objekter eller hele sener• Spesifisere objektene som skal ”rendres”.• Render: Den prosessen som en datamaskin utfører når den skaper

(tegner opp) digitale bilder av objekter på grunnlag av modeller av objektene.Modellene av objektene er matematiske modeller. Modellene blir konstruert på grunnlag av et lite sett med geometriske primitiver: punkter, linjer og polygoner. Primitivene er spesifisert av objektenes hjørne/overflatepunkter.

• Det endelige produktet etter en renderingsprosess er et bilde som består av pixler tegnet på en dataskjerm.

Page 9: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 9

OpenGL primitiver:

Page 10: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 10

OpenGL metode-/kommandosyntaks

• OpenGL metoder skrevet i java, begynner med gl.gl + Metodenavn. Sammensatte metodenavn i OpenGL skrives med store bokstaver også for hvert av de egne ordene i det sammensatte navnet. Konstanter skrives med store bokstaver og understrekningstegn mellom de sammensatte ordene. Se eksemplet under:

• Eks Tegning av et polygon:• gl.glClearColor(0.0, 0.0, 0.0, 0.0);   //angir fargen som skal benyttes til å rense fargebufferet: svart

gl.glClear(GL.GL_COLOR_BUFFER_BIT); //renser fargebuf. og setter fargen til rensefargen. gl.glColor3f(1.0f, 1.0f, 1.0f);  // Setter fargen på objektene som skal tegnes: hvit

gl.glOrtho(-1.0, 1.0, -1.0, 1.0, -1.0, 1.0);  //enabler en ortogonal projeksjon og angir synsvolum 

gl.glBegin(GL.GL_POLYGON);   //Start tegn. Def. hvilken type primitiv som skal benyttes gl.glVertex2f(-0.5f, -0.5f);   //  Angir verdier på polygonets hjørnepunkter (2D)  gl.glVertex2f(-0.5f, 0.5f);      gl.glVertex2f(0.5f, 0.5f);      gl.glVertex2f(0.5f, -0.5f);  gl.glEnd();   //Slutt på tegning av polygonetgl.glFlush(); // Sikrer at tegnekommandoene virkelig blir utført

• Vi ser at for enkelte av metodenavnene så står det 2f eller 3f foran parentesene. Det betyr at antall argumenter er henholdsvis 2 eller 3 og at datatypen på argumentene er float.

Page 11: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 11

Datatyper

Suffix Data Type TypicalCorresponding C-language Type

TypicalCorresp.Java Type

OpenGL Type Definition

b 8-bit integer signed char byte GLbyte

s 16-bit integer short short GLshort

i 32-bit integer long int GLint, GLsizei

f 32-bit floating-point

float float GLfloat, GLclampf

d 64-bit floating-point

double double GLdouble, GLclampd

ub 8-bit unsigned integer

unsigned char GLubyte, GLboolean

us 16-bit unsigned integer

unsigned short GLushort

ui 32-bit unsigned integer

unsigned long GLuint, GLenum, GLbitfield

Page 12: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 12

OpenGL en “tilstandsmaskin”

• OpenGL settes i en tilstand/modus som forblir slik til den blir endret. Tilstandene kan gjelde farge, koordinattransformasjoner, ..

• Sett farge gl.glColor3f(1.0f, 1.0f, 1.0f); Setter fargen til hvit.

• Etter dette vil hvert objekt som tegnes bli hvitt, helt til den gjeldende fargen settes til noe annet.

• Mange tilstandsvariabler refererer til moduser/tilstander som enten kan slås på eller av.

• Dette kan gjøres med gl.glEnable() og gl.glDisable()

gl.glEnable(GL.GL_DEPTH_TEST); //Enables Depth Testing

• Verdien på tilstandsvariablene kan finnes ved metodekallene:

gl.glGetBooleanv(), gl.glGetDoublev(), gl.glGetFloatv(), gl.glGetIntegerv(), gl.glGetPointerv(), gl.glIsEnabled()

Page 13: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 13

Noen tilstandsvariabler for fargeTable B-5 : Coloring State Variables

State Variable Description Attribute Group

Initial Value Get Command

GL_FOG_COLOR Fog color fog 0, 0, 0, 0 glGetFloatv()

GL_FOG_INDEX Fog index fog 0 glGetFloatv()

GL_FOG_DENSITY Exponential fog density fog 1.0 glGetFloatv()

GL_FOG_START Linear fog start fog 0.0 glGetFloatv()

GL_FOG_END Linear fog end fog 1.0 glGetFloatv()

GL_FOG_MODE Fog mode fog GL_EXP glGetIntegerv()

GL_FOG True if fog enabled fog/enable GL_FALSE glIsEnabled()

GL_SHADE_MODEL glShadeModel() setting lighting GL_SMOOTH glGetIntegerv()

GL_PROJECTION_MATRIX

Projection matrix stack -- Identity glGetFloatv()

gl.glShadeModel(GL.GL_SMOOTH); //Enables Smooth Color Shading

Page 14: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 14

OpenGL rendering pipeline

1. Inndata: Geometriske data eller pixeldata2. Display lister: mellomlagring av inndata3. Evaluators: Evaluatorer tilbyr metoder for å utlede/bestemme/beregne hjørnepunkter for å

kunne tegne ut en 3D-flate på grunnlag av kontrollpunktene. 4. Per-Vertex Operasjoner: Samlingen av hjørnepunkter vil bli konvertert til primitiver, e.g.

linjer, polygoner osv. Romlige koordinater blir transformert og projisert fra en posisjon i 3D verden til en posisjon på skjermen, 2D.

5. Primitive Assembly Klipping er en viktig del av primitiv assembly.6. Texture Assembly: OpenGL kan legge textur-bilder på geometriske objekter7. Rasterisering. Omforming av geometriske- og pixel-inndata til fragmenter.8. Fragmentoperasjoner(skjermpixler) Før de endelige pixleverdiene blir lagret i

bildelageret/framebufferet, blir det utført en rekke operasjoner som kan endre og fjerne fragementer

Page 15: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 15

OpenGL rendering pipeline

1. Inndata: Geometriske data eller pixeldata2. Display lister: mellomlagring av inndata3. Evaluators: Alle geometriske primitiver kan beskrives av hjørnepunkter (Vertices). Noen flater kan

beskrives av kontrollpunkter og matematiske basisfunksjoner. Evaluatorer tilbyr metoder for å utlede/bestemme/beregne hjørnepunkter for å kunne tegne ut flaten basert på kontrollpunktene.

4. Per-Vertex Operasjoner: Samlingen av hjørnepunkter vil bli konvertert til primitiver, for eks. linjer polygoner osv. Romlige koordinater blir transformert og projisert fra en posisjon i 3D verden til en posisjon på skjermen.

5. Primitive Assembly Klipping er en viktig del av primitiv assembly. Punkt klipping, linje og polygon-klipping. Perspektiv divisjon. Objekter langt borte ser mindre ut. Resultatet av P.A. er fullstendige geometriske primitiver som er transformert og klippet med rettfarge og dybde og også med texturverdier og retningslinjer for rasterisering.

6. Texture Assembly: OpenGL kan legge textur-bilder på geometriske objekter for å få de til å se mer realistiske ut.

Page 16: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 16

OpenGL rendering pipeline

7 Rasterisering. Omforming av geometriske- og pixel-inndata til fragmenter. Hver fragmentrute tilsvarer en pixel i bildebufferet. Når hjørnepunkter, vertices, knyttes sammen til linjer eller indre pixler beregnes for å fylle polygoner, blir linje og polygonstriper, linjebredde, punktstørrelse, skyggeleggingsmodell og overdekkingsberegninger for på unngå alliasing, vurdert. Farge og dybdeverdier blir tilordnet hver enkelt pixel/fragmentrute.

8 Fragmentoperasjoner(skjermpixler) Før de endelige pixlverdiene blir lagret i bildelageret/ framebufferet, blir det utført en rekke operasjoner som kan endre og til og med fjerne fragementer. Alle disse operasjonene kan enables eller disables, dvs slås av eller på. Den første operasjonen som kan bli slått på er tekstur, hvor et teksturelement blir generert fra teksturminnet for hvert fragment og lagt oppe på fragmentet. Så kan eventuelt tåkeberegninger bli utført. Deretter kan følgende tester utføres, scissor/klippetesten(default klipperektangel matcher størrelsen på vinduet på skjermen og klippetesten er slått av). Så kan det utføres en alpha/gjennomsiktighetstest, og dybdebuffer- test for å fjerne skjulte flater. Dersom et fragment ikke består en påslått-test, kan det medføre at den videre prosesseringen av en fragmentrute avsluttes. Til slutt kan blending (det innkommende fragmentets R,G,B og alpha-verdier blir kombinert med de samme R,G,B-verdiene på det pixelet som allerede er lagret på den samme plassen i bildebufferet), dithering (kan øke fargeoppløsningen på bekostning av romlig oppløsning ved at fargeverdien i et pixel, blir beregnet på grunnlag av omgivende pixler), logiske operasjoner (OR, XOR og Invert) og maskering av en bit-maske bli utført. Etter alt dette blir det

grundig prosesserte fragmentet lagt på riktig plass i skjermminnet som en pixelverdi.

Page 17: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 17

Biblioteker relatert til OpenGL

• GLU (OpenGL Utility Library)• Inneholder mange rutiner/metoder som benytter flere lavnivå OpenGL metoder til å

utføre oppgaver som b.a. å sette opp matriser for ulike betraktningsorienteringer:

• glu.gluPerspective(GLfloat fovy, GLfloat h/ Glfloat w, Glfloat near, GLfloat far);

• GLU-rutinene begynner med glu.gluMetode/rutinenavn()

Page 18: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 18

Biblioteker relatert til OpenGL GLUT (OpenGL Utility Tookit) • OpenGL er uavhengig av vindussystemer og operativsystemer. OpenGL inneholder

ingen kommandoer for å åpne vinduer eller lese hendelser fra tastatur eller mus. • GLUT forenkler åpning av vinduer og registrering av input. OpenGL’s

tegnekommandoer er begrenset til å generere enkle geometriske primitiver (punkter, linjer og polygoner)

• GLUT inneholder en god del rutiner som lager mer kompliserte 3d-objekter (teapot, torus(smultringer), kuler osv). GLU inneholder også noen rutiner som kan generere noen av de samme figurene som GLUT (kule, sylinder, skiver)

Page 19: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 19

Et lite eksempel: Tegning av en trekant og en firkant

• Enkelt rammeverk for kjøring av OpenGl-programmer i Java• /* */• import java.awt.*; // klassene Color og Graphics• import java.util.*;• import javax.swing.*; // klassene JFrame og JPanel• import javax.media.opengl.*; // JOGL• class Vindu extends JFrame {• public Vindu(String tittel) {• setTitle(tittel);• setDefaultCloseOperation(EXIT_ON_CLOSE);

TegningOv1_1JOGL tegningen = new TegningOv1_1JOGL(400, 400); add(tegningen);

• pack();• }• }• /*Klassen som inneholder main*/

• class GrafikkEksempelOv1JOGL {• public static void main(String[] args) {• Vindu etVindu = new Vindu("En trekant og en firkant");• etVindu.setVisible(true);• }• }

Page 20: Introduksjon

Lineær algebra med grafiske anvendelser. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL V2010 Jan H. Nilsen Leksjon 1, side 20

Et lite eksempel: Tegning av en trekant og en firkant

Del av tegnefila/klassen TegningOv1_1JOGL :public void drawGLScene(GLAutoDrawable glDrawable) { GL gl = glDrawable.getGL(); gl.glClear(GL.GL_COLOR_BUFFER_BIT | GL.GL_DEPTH_BUFFER_BIT); //Clear the Color buffer and the Depth Buffer gl.glLoadIdentity(); //Initializes the current matrix to an identity matrix gl.glTranslatef(-1.5f,0.0f,-8.0f); // Move Left 1.5 Units and Into The Screen 8 gl.glBegin(GL.GL_TRIANGLES); // Start Drawing Triangles gl.glVertex3f( 0.0f, 1.0f, 0.0f); // Top gl.glVertex3f(-1.0f,-1.0f, 0.0f); // Bottom Left gl.glVertex3f( 1.0f,-1.0f, 0.0f); // Bottom Right gl.glEnd(); // End Drawing the Triangle

gl.glTranslatef(3.0f,0.0f,0.0f); // Move Right 3 Units gl.glBegin(GL.GL_QUADS); // Start Draw a Quad gl.glVertex3f(-1.0f, 1.0f, 0.0f); // Top Left gl.glVertex3f( 1.0f, 1.0f, 0.0f); // Top Right gl.glVertex3f( 1.0f,-1.0f, 0.0f); // Bottom Right gl.glVertex3f(-1.0f,-1.0f, 0.0f); // Bottom Left gl.glEnd(); // Done Drawing the Quad } /** void display() Draw to the canvas. */ /* Purely a Java thing. Simple calls drawGLScene once GL is initialized*/ public void display(GLAutoDrawable glDrawable) { GL gl = glDrawable.getGL(glDrawable); drawGLScene(glDrawable); // Calls drawGLScene() glDrawable.swapBuffers(); //Swap buffers gl.glFlush(); // Tvinger tidligere buffrede OpenGL kommandoer til å utføres med en gang.}