Programmering grunnkurs TDAT1001: Grafikkdel. Introduksjon

Transkript

1 Programmering grunnkurs TDAT1001: Grafikkdel 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 Biblioteker relatert til OpenGL side Et lite eksempel: side Programmering grunnkurs TDAT1001-A 14H. Grafikkdelen: Introduksjon til OpenGL med Javabinding JOGL Jan H. Nilsen Leksjon 1, side 1

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 nesten fotorealistiske syntetiske bilder av 3D objekter. I grafisk databehandling blir de 2D- eller 3D-objektene, som skal tegnes ut, først beskrevet ved matematiske modeller. En terning/kube kan for eksempel modelleres matematisk ved å definere et tredimensjonalt koordinatsystem med origo og akser med enheter på aksene. Så angis 3D-koordinatene til hjørnepunktene på terningen, i dette koordinatsystemet. Prosesseringene som utføres på dataene som genereres fra den matematiske beskrivelsen av objektene, (3d-koordinater), fram til ferdige uttegninger på en dataskjerm, kalles rendering. Ulike grafiske programvaresystemer vil som oftest ha ulike måter å gjøre dette på. I dette faget skal vi benytte det grafiske programvaresystemet OpenGL. Leksjon 1, side 2

3 Noen eksempler på datagrafikk Web-siden: 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 smokefilled room. Leksjon 1, side 3

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: En eldre versjon av boka OpenGL Programming Guide Red Book ligger på nettet. Mesteparten av lærestoffet finnes i deler av kap Leksjon 1, side 4

5 OpenGL Introduksjon til OpenGL med Javabinding, JOGL 1. er etablert som en industristandard og referansestandard for generell 3D grafikk 2. er utviklet av Silicon Graphics. 3. utvikles nå under kontroll av Khronos Group. Beskrivelse av denne virksomheten finnes på: 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. Se f.eks: 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. Leksjon 1, side 5

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 (få) 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 Leksjon 1, side 6

7 OpenGL primitiver: Leksjon 1, side 7

8 Hva kan OpenGL gjøre: Konstruere objekter ved hjelp av geometriske primitiver og dermed visualisere matematiske beskrivelser av objektene. (OpenGL betrakter punkter, linjer, polygoner, digitale bilder (texture) som primitiver) Ordne objekter i 3D-rom og velge betraktningsposisjon og belysning for å se på objektene. Beregne fargene på objektene. Fargene kan være eksplisitt gitt av anvendelsen, bestemt av betraktningsbetingelser, eller ved tekstur/ materialegenskaper 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. Leksjon 1, side 8

9 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 matematiske 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 spesifiserer objektenes hjørne/overflatepunkter. Det endelige produktet etter en renderingsprosess er et bilde av objektene som består av pixler tegnet på en dataskjerm. Se feks.: Leksjon 1, side 9

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); //aktiverer 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 polygonet gl.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. Leksjon 1, side 10

11 Datatyper Suffix Data Type Typical Corresponding C-language Type Typical Corresp. Java Type b 8-bit integer signed char byte GLbyte s 16-bit integer short short GLshort OpenGL Type Definition i 32-bit integer long int GLint, GLsizei f d ub us ui 32-bit floatingpoint 64-bit floatingpoint 8-bit unsigned integer 16-bit unsigned integer 32-bit unsigned integer float float GLfloat, GLclampf double double GLdouble, GLclampd unsigned char unsigned short unsigned long GLubyte, GLboolean GLushort GLuint, GLenum, GLbitfield Leksjon 1, side 11

12 OpenGL en tilstandsmaskin OpenGL settes i en tilstand/modus som forblir slik til den blir endret. Tilstandene kan omfatte farge, koordinattransformasjoner,. Feks: Sett farge gl.glcolor3f(1.0f, 0.0f, 0.0f); Setter fargen til rød. Etter dette vil hvert objekt som tegnes bli rødt, 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() Leksjon 1, side 12

13 Noen tilstandsvariabler Table 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_M ATRIX Projection matrix stack -- Identity glgetfloatv() gl.glshademodel(gl.gl_smooth); //Enables Smooth Color Shading Leksjon 1, side 13

14 OpenGL rendering pipeline 1. Inndata: Geometriske data eller pixeldata 2. Display lister: mellomlagring av inndata 3. 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 objekter 7. 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 Leksjon 1, side 14

15 OpenGL rendering pipeline 1. Inndata: Geometriske data eller pixeldata 2. Display lister: mellomlagring av inndata 3. 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 polygonklipping. 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. Leksjon 1, side 15

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. Leksjon 1, side 16

17 Biblioteker relatert til OpenGL GLU (OpenGL Utility Library) Inneholder rutiner/metoder som benytter flere lavnivå OpenGL metoder til å utføre oppgaver som b.a. å sette opp matriser for ulike betraktningsprojeksjoner: glu.gluperspective(glfloat fovy, GLfloat h/ Glfloat w, Glfloat near, GLfloat far); GLU-rutinene begynner med glu.glumetode/rutinenavn() Leksjon 1, side 17

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) Leksjon 1, side 18

19 Et lite eksempel: Tegning av en trekant og en firkant Et 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 { publicvindu(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 { publicstatic void main(string[] args) { Vindu etvindu = new Vindu("En trekant og en firkant"); etvindu.setvisible(true); } } Leksjon 1, side 19

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. } Leksjon 1, side 20