CG simple openGL point & line-course 2

4,534 views

Published on

OpenGL - point & line design
introduce the construction of displayers (CRT, Flat-panel, LCD, PDP, projector...)
those render is based on graphic skills (point & line)

Published in: Design, Technology, Business
  • Be the first to comment

CG simple openGL point & line-course 2

  1. 1. Simple OpenGLProgram (point & line) Chen Jing-Fung (2006/11/13) Assistant Research Fellow, Digital Media Center, National Taiwan Normal University National Taiwan Normal University
  2. 2. Displayers• CRT & Flat-panel Display http://www.plasmadepot.com/plasmatv/plasmatv101.html 2
  3. 3. CRT (Cathode ray tube) • Cutaway rendering of a color CRT Display Mask Anode connection Phospfor layer Deflection coils Focusing coils Electron beams Electron guns Close-up of the Phospfor layer 3http://en.wikipedia.org/wiki/Cathode_ray_tube
  4. 4. TFT LCD (Thin Film Transistor Liquid Crystal Display) • TFT LCD has a sandwich-like structure with liquid crystal filled between two glass plates. 4http://www.plasma.com/classroom/what_is_tft_lcd.htm
  5. 5. PDP (Plasma Display Panel) • A plasma TV is sometimes called an "emissive" display — the panel is actually self-lighting. • The display consists of two transparent glass panels with a thin layer of pixels sandwiched in between. 5http://www.plasmadepot.com/plasmatv/howplasmaworks.html
  6. 6. What is different?• CRT – Electrostatic deflection of the electron beam• LCD – Back light module• PDP – Tiny colored fluorescent lights 6
  7. 7. DIY your projector USD$200 Cutaway rendering of the projector Fresnel Lens Conventional Lens 5.5’’ LCD + VCD player = $169 USD http://en.wikipedia.org 7http://www.audiovisualizers.com/madlab/lcd_proj.htm
  8. 8. Basic video-controller refresh operations Horizontal and Vertical Raster-Scan Generator Deflection Voltage x Register y Register Memory Address Pixel Register Intensity Frame Buffer 8
  9. 9. Frame Buffer• Cartesian reference frame with origin at the lower-left corner of a video monitor y x 9
  10. 10. Coordinate representations Viewing & Projection Coordinates 1 1 Modeling 1 Video Monitor(local or master) Coordinates Plotter World Normalized (Cartesian) Coordinates Coordinates Other Output Device Coordinates 10
  11. 11. • Coordinates: – Modeling (m), World (w), Viewing (v), Projection (p), Normalized (n), Device (d) • (xmc, ymc, zmc) -> (xwc, ywc, zwc) -> (xvc, yvc, zvc) -> (xpc, ypc, zpc) -> (xnc, ync, znc) -> (xdc, ydc) 11
  12. 12. Graphs system • User program, Graphics system, I/O devices Function calls Output User Graphics I/O devicesprogram system Data Input 12
  13. 13. Application ProgrammingInterface (API) Functions• Divide API functions into seven groups: – Primitive functions – Attribute functions – Transformation functions – Viewing functions – Input functions – Control functions 13
  14. 14. Primitive & Attribute• Primitive functions - graphics output primitives – Character strings & geometric entities • Points, lines, areas and shapes (2D, 3D)• Attribute functions - Properties of the output primitives – Describe how a particular primitive is to be displayed • Color specifications, line styles, text styles and area- filling patterns … 14
  15. 15. Viewing• Select a view of the scene -> type of projection -> location on monitor• Other routines: – Managing the scene display area • Specifying its position, size and structure • Identified visible objects and applied lighting conditions (3D) 15
  16. 16. Software standards - GL • Graphics Library (GL) a widely used package in the graphics community – Goal: fast, real-time rendering and package was being extended to other hardware systems. – International Standard Organization (ISO) • Graphical kernel system (GKS) 1984 – 2D & 3D • Programmer’s Hierarchical Interactive Graphics Standard (PHICS) – Increase: object modeling, color specification, surface rendering… – PHICS+ (3D) 16
  17. 17. Software standards - OpenGL• OpenGL : a hardware-independent version of GL in the early 1990s.• The graphics package is maintained and updated by OpenGL Architecture Review Board.• Language binding – C and C++ 17
  18. 18. Other Graphics Packages• Graphics libraries – Java 2D (Java applets) – Java 3D – Mathematica – Matlab – Maple… 18
  19. 19. Introduction to OpenGL• Overview OpenGL based on VC++ – http://dev.yesky.com/424/2080424.shtml• Basic OpenGL Syntax – Function names in OpenGL basic Library • Ex: glBegin, glClear, glCopyPixels… – Arguments in Function (interval: _ ) • Ex: GL_2D, GL_RGB, GL_POLYGON… – Specific data types • Ex: GLbyte, GLshort, Glint… 19
  20. 20. OpenGL – Related Libraries• GL: basic core library (prefix: gl)• OpenGL Utility (GLU): (prefix: glu) – Setting up viewing and projection matrices – describing complex objects with line and polygon – Displaying quadrics and B-splines – Processing the surface-rendering operations – Other complex tasks 20
  21. 21. OpenGL- Display window• OpenGL Extension: – X Window System (GLX) - Prefix: plX – Apple GL (AGL) - Prefix: agl – Microsoft Windows system (WGL) - Prefix: wgl – IBM OS/2 (Presentation Manager to OpenGL: PGL) - Prefix: pgl 21
  22. 22. OpenGL Utility Toolkit (GLUT)– Provide a library of functions for interacting with any screen-windowing system. • Prefix: glut • Contain: describing and rendering quadric curves and surfaces • Download: (glut-3.7.6-bin.zip ~117 KB) http://www.xmission.com/~nate/glut.html 22
  23. 23. How to Use GLUT?• Put 3 files from ``glut-3.7.6-bin.zip’’ in your project directory. – README-win32.txt • glut32.dll to %WinDir%System • glut32.lib to $(MSDevDir)....VC98lib • glut.h to $(MSDevDir)....VC98includeGL 23
  24. 24. Setup for a OpenGL Program 1/5• Microsoft Visual C++ 6.0 – Step 1: create a Win32 Console Application project 24
  25. 25. Setup for a OpenGL Program 2/5– Step 2:Press Alt-F7 project -> settings...->Link– Step 3:add opengl32.lib glu32.lib glut32.lib into Object/library modules 25
  26. 26. Setup for a OpenGL Program 3/5• Microsoft Visual C++ .Net – Step 1:create Win32 console project 26
  27. 27. Setup for a OpenGL Program 4/5– Step 2: select ―empty project‖ 27
  28. 28. Setup for a OpenGL Program 5/5– Step 3:select project->property…->linker -> input– Step 4: add opengl32.lib glu32.lib glut32.lib 28
  29. 29. Header Files 2/1• Include the header file the OpenGL core library – #include <windows.h> • With Microsoft Windows – #include <GL/gl.h> • Basic core library – #include <GL/glu.h> • Object-oriented toolkit & 3D application 29
  30. 30. Header Files 2/2• Use GLUT to handle the window-managing operations. – #include <GL/glut.h> • gl.h, glu.h (redundant and could affect program portability)• Need to include c++ code – #include <stdio.h> #include <stdlib.h> #include <math.h>…• ISO/ANSI standard for c++ – Include: cstdio, cstdlib and cmath 30
  31. 31. Display-Window Management Using GLUT 2/1• Initialization function – glutInit(&argc, argv);• Create display window (DW) and caption – glutCreateWindow(―An Example OpenGL Program‖);• Assign our picture to DW – Ex: describing a line segment – glutDisplayFunc(lineSegment);• But DW is not yet. More GLUT function -> complete the window-processing operations – glutMainLoop( ); <- the last line (check all input devices – mouse or keyboard) 31
  32. 32. Display-Window Management Using GLUT 2/2• Top-left corner of the video display (50,100) – glutInitWindowPosition(50, 100);• Display window of OpenGL: width=400 pixels and height= 300pixels – glutInitWindowSize(400, 300); 100 50 Display window 300 400 • A single refresh buffer & RGB mode – glutInitDisplayMode(GLUT_SINGLE|GLUT_RGB) 32
  33. 33. A complete OpenGL Program 2/1• Set background color: white – glClearColor(1.0, 1.0, 1.0, 0.0); <- alpha value is as a ``blending’’ parameter.• Get the assigned window color displayed – glClear(GL_COLOR_BUFFER_BIT);• Set object color – glColor3f(1.0, 0.0, 0.0); 33
  34. 34. A complete OpenGL Program 2/2• OpenGL processes our picture (2D line) through the full 3D viewing operations – “project’’ – glMatrixMode(GL_PROJECTION);• Map rectangle – glOrtho2D(0.0, 200.0, 0.0, 150.0);• Cartesian endpoint coordinate – glBegin(GL_LINES); glVertex2i(180, 15); glVertex2i(10, 145); glEnd(); 34
  35. 35. 35
  36. 36. Display function User define 36
  37. 37. Point Specification• OpenGL functions – glVertex*();<-The coordinate values – EX: glBegin (GL_POINTS); glVertex2iv (p1); //i: integer y glVertex2iv (p2); glVertex2iv (p3); glEnd (); p2• C++ class or structure p1 p3 – Ex: Class wcPt2D { Public: wcPt2D pointPos; x GLfloat x, y; pointPos.x = 120.75; }; pointPos.y = 45.30; glBegin (GL_POINTS); glVertex2f (pointPos.x, pointPos.y); glEnd (); 37
  38. 38. OpenGL Line functions glBegin (*); glVertex2iv (p1); glVertex2iv (p2); glVertex2iv (p3); glVertex2iv (p4); glVertex2iv (p5); glEnd (); p3 p3 p3 p1 p5 p1 p5 p1 p2 p4 p2 p4 p2 p4Primitive line generated polyline generated Closed polyline generated with GL_LINES with GL_LINE_STRIP with GL_LINE_LOOP 38
  39. 39. Line-drawing algorithms 2/1• A straight-line segment in a scene is defined by the coordinate positions for the endpoints of the segment.• Line is compose of the nearest pixel positions along the line path between the two endpoints.• Ex: point (10.48, 20.51)->(10,21) 39
  40. 40. Line-drawing algorithms 2/2• The Cartesian slope-intercept equation for a straight line – y=m*x+b Dy Dx – slope m=(yend-y0)/(xend-x0) yend y0 – Intercept b=y0-m*x0• Digital differential analyzer x0 xend Dx = 1, yk+1 = yk + m Dy Dy = 1, xk+1 = xk + 1/m Dx • Steps? yend ?? Dx = -1 ? or Dy = -1 ? yk 40 xk xend
  41. 41. How to a parameter drawing line? National Taiwan Normal University
  42. 42. Bresenham’s line algorithm 3/1• Bresenham’s line is an accurate and efficient raster line-generating algorithm• Use only incremental integer calculations.• Determine at next sample point whether to plot. – The negative-slope line: if start point (50, 50), next point? • (51, 50) or (51, 49) 42
  43. 43. Analysis Bresenham’s line algorithm• The scan-conversion process: – Set the positive slope < 1.0 and start point (x0, y0) – Let the kth step in this process, therefore, the displayed pixel (xk, yk) • Next pixel (xk+1, yk) or (xk+1, yk+1) – The sampling position xk+1, depend on (dlow- dup) • The label vertical pixel separations from dlow and dup • Pk=Dx(dlow-dup) is the same as the sign of (dlow- dup) – If yk ~ line, (dlow< dup), then pk< 0 – Next pk+1 ? yk+1 m – First parameter p0 ? yk 1-m xk+1 43
  44. 44. Bresenham’s line algorithm 3/3(m<1.0)• Step 1: Input left endpoint (x0, y0)• Step 2: Set the color for frame-buffer position (x0, y0)• Step 3: Calculate Dx, Dy, 2Dy and 2Dy-2Dx – If yk+1>yk, p0=2Dy-Dx, else yk+1<yk, p0=2Dy+Dx yk+3 y = mx + b• Step 4: The decision parameter pk+1 yk+2 – If pk<0 & next point is (xk+1, yk) yk+1 y • pk+1= pk+2Dy yk – Else next point is (xk+1, yk+1) xk xk+1 xk+2 xk+3 • pk+1= pk+2Dy-2Dx• Step 5: return step 4 Dx-1 times yk+1 m yk 1-m xk+1 44
  45. 45. Bresenham’s line example • Start point: (20, 10) • End point: (30, 18) 45
  46. 46. Homework• HW 1: Draw line from (30, 150) to (200, 10) – Hint : line-drawing algorithm – If you use one decision parameter to do, you will get the reward.• HW 2: Plot the regular polygon (3, 4, 5, cycle) 46
  47. 47. Two important points of Homework• Explain (30%)• Program (70%) 47
  48. 48. References• .Net Education website: – http://yes.nctu.edu.tw/DotNet/index.ht m• Mathworld – http://mathworld.wolfram.com/ 48

×