2-primitivas

26
 1 PrimitivasGráficas VyGLab– Lab. de Investigación y Desarrollo en Visualización y Computación Gráfica Dpto. de Ciencias e Ingeniería de la Computación Universidad Nacional del Sur Lasprimitivasgráficaspuedenclasificarseenprimitivas   DeSalida Primitivas   DeEntrada Silvia Castro CG 2012

Upload: giovanni-contreras

Post on 22-Jul-2015

220 views

Category:

Documents


0 download

TRANSCRIPT

Primitivas Grficas

VyGLab Lab. de Investigacin y Desarrollo en Visualizacin y Computacin Grfica Dpto. de Ciencias e Ingeniera de la Computacin Universidad Nacional del Sur

PrimitivasLas primitivas grficas pueden clasificarse en primitivas De Salida De Entrada

Silvia Castro

CG 2012

1

Primitivas de SalidaLos objetos grficos que se generan sobre los dispositivos de salida estn compuestos de primitivas de salida. Una clasificacin de stas puede ser la siguiente Punto Polilnea Regin rellena Texto Imagen rasterizada

Estas primitivas grficas tienen atributos caractersticas que afectan su apariencia.Silvia Castro

que

son

las

CG 2012

Primitivas de SalidaUn atributo (o parmetro de atributo) es cualquier parmetro que afecta la forma en que una primitiva es mostrada.

Los atributos pueden Incorporarse como parmetros a las primitivas Setearse separadamente

Silvia Castro

CG 2012

2

Primitivas de SalidaPunto El punto es la primitiva bsica de salida ms simple. Se especifica mediante sus coordenadas. P d ifi di t d d Podemos dib j un dibujar punto:DibujarPunto(GLint x, GLint y) glBegin(GL_POINTS); glVertex2i(x, y); glEnd();

Los distintos atributos que puede tener un punto son su color y su tamao. Cmo se especifican stos en OpenGL?Silvia Castro CG 2012

Primitivas de SalidaPolilnea La polilnea es una secuencia de lneas rectas conectadas.

Las imgenes hechas de polilneas a menudo se denominan dibujos de lneas.Silvia Castro CG 2012

3

Primitivas de SalidaPolilnea La polilnea ms simple es un segmento de recta y se especifica mediante dos puntos, el inicial y el f final.x1 , y1

x0 , y0

Cuando est compuesta de varias lneas, cada una de stas se p , denomina segmento; dos segmentos adyacentes se unen en un vrtice. Las polilneas se especifican mediante una secuencia de vrtices. Vea cmo se puede dibujar una polilnea utilizando OpenGL.Silvia Castro CG 2012

Primitivas de SalidaLos atributos bsicos de los segmentos de lnea son Tipo A h Ancho Color

Silvia Castro

CG 2012

4

Primitivas de SalidaAtributo Ancho

Generacin de lneas anchas

Opciones d l i o pincel O i de lpiz i l Patrones de lpiz y pincel para mostrar lneas

Silvia Castro

CG 2012

Primitivas de SalidaOpciones de lpiz o pincel

Mscara de pixels y el arreglo de pixels asociado

Generacin de la lnea con la mscara de pixels

Lneas curvas distintos pincelesSilvia Castro

con

CG 2012

5

Primitivas de SalidaAtributo Tipo

glEnable(GL_LINE_STIPPLE); // Lnea con tres estilos diferentes alt=125.0; g glLineStipple(1, 0x0101); pp ( , ); DibujarLinea(50.0,alt, 150.0,alt); glLineStipple(1, 0x00FF); DibujarLinea(150.0,alt, 250.0,alt); glLineStipple(1, 0x1C47); DibujarLinea(250.0,alt, 350.0,alt);

Silvia Castro

CG 2012

Primitivas de SalidaAtributo Ancho

// Segunda lnea con tres estilos y anchos diferentes glLineWidth(8.0); glLineStipple(1, 0x0101); DibujarLinea(50.0,alt, 150.0,alt); glLineWidth(1.5); glLineWidth(1 5); glLineStipple(1, 0x00FF); DibujarLinea(150.0,alt, 250.0,alt); glLineWidth(4.0); glLineStipple(1, 0x1C47); DibujarLinea(250.0,alt, 350.0,alt);

Silvia Castro

CG 2012

6

Primitivas de SalidaAtributo Color

// Cuarta lnea con tres colores diferentes glLineWidth(2.0); glLineStipple(1, 0x00FF); glColor3f(1.0,0.0,0.0); DibujarLinea(50.0,alt, 150.0,alt); glColor3f(0.0,1.0,0.0); DibujarLinea(150.0,alt, 250.0,alt); glColor3f(0.0,0.0,1.0); DibujarLinea(250.0,alt, 350.0,alt);

Silvia Castro

CG 2012

Primitivas de SalidaAlgunas primitivas geomtricas de OpenGL

Cmo escribira el segmento de cdigo correspondiente a DibujarLnea?DibujarLinea(GLint xi, GLint yi, GLint xf, GLint yf) glBegin(GL_LINES); glVertex2i(xi, yi); glVertex2i(xf, yf); glEnd();Silvia Castro CG 2012

7

Primitivas de SalidaPolilnea Una polilnea puede determinar una figura cerrada o no. Normalmente, a todos los segmentos de una polilnea se les da el mismo atributo. Cmo escribira en OpenGL la siguiente primitiva?DibujarPolilinea(polilinea);

Cmo controlara los atributos de la misma?

Silvia Castro

CG 2012

Primitivas de SalidaPolilnea Propiedades de los segmentos

Silvia Castro

CG 2012

8

Primitivas de SalidaPolilnea A las caractersticas de los segmentos de la polilnea, deben agregarse las de su conexin conexin.

Silvia Castro

CG 2012

Primitivas de SalidaRegin rellena Esta primitiva corresponde a una forma rellena. El borde de la misma est constituido en su forma ms simple por un constituido, simple, polgono.

Estilos de rellenado de polgonosSilvia Castro

Rellenado de polgonos utilizando patrones hatchCG 2012

9

Primitivas de SalidaRegin rellenaglRectf(25.0, alti,125.0, altf); glEnable(GL_POLYGON_STIPPLE); glColor3f(0.6,0.4,0.0); glPolygonStipple(mosca); glRectf(125.0, alti,225.0, altf); glColor3f(0.6,0.1,0.6); glPolygonStipple(medio_tono); glRectf(225.0, alti,325.0, altf);

Distintos rellenados polgonos.

de

glColor3f(0.4,0.8,0.2); lC l 3f(0 4 0 8 0 2) glPolygonStipple(tono); glRectf(325.0, alti,425.0, altf); glDisable(GL_POLYGON_STIPPLE);

Silvia Castro

CG 2012

Primitivas de SalidaRegin rellena El proceso de rellenar un rea con un patrn rectangular se denomina tiling y los patrones de rellenado rectangular se g p g denominan tiling patterns

El arreglo patrn (a) se pone sobre el rea a rellenar de un paraleleppedo.Silvia Castro CG 2012

10

Primitivas de SalidaPrimitivas geomtricas de OpenGL

Silvia Castro

CG 2012

Primitivas de SalidaTexto La mayora de los dispositivos de salida tienen dos formas distintas de mostrar un texto: Modo texto Modo grfico

ste!

g p En el modo texto se usa un generador de caracteres incorporado y se dibujan caracteres alfabticos, numricos, signos de puntuacin y algunos smbolos especiales (editores). En el modo grfico se puede tener un conjunto ms rico de formas y los caracteres pueden ubicarse arbitrariamente en la pantalla.Silvia Castro CG 2012

11

Primitivas de SalidaTexto La apariencia de los caracteres se controla mediante atributos tales como font, tamao, color y orientacin. El font es el estilo de diseo particular tal como Lucida Casual, Courier, Monotype Corsiva, Impact ... Los caracteres de un font seleccionado pueden mostrarse con distintos estilos de subrayado (con una lnea , por ejemplo), en g , sombreados. negrita, en itlica y tambin sombreados Tambin puede variarse el color de los distintos caracteres y escribirse en distintos colores tales como rojo, verde, naranja, mostaza, azul, ...Silvia Castro CG 2012

Primitivas de SalidaTexto Distintas direcciones para el texto

Valores de los atributos de alineamiento para cadenas verticales y horizontales.Silvia Castro CG 2012

12

Primitivas de SalidaTexto Fonts

Mapa de bits

Polgonos o Splines

Silvia Castro

CG 2012

Primitivas de SalidaImagen Una imagen est constituida por pixels.

El arreglo como un todo se denomina, a menudo, mapa de pixels. Tambin se usa el trmino bitmap, pero ste debera reservarse para los mapas de pixels donde cada pixel se representa mediante un solo bit.Silvia Castro CG 2012

13

Primitivas de SalidaImagen La imagen digital es entonces un arreglo de pixels, cada uno de los cuales representa un lugar particular (x,y) y cada uno tiene un valor digital correspondiente al brillo o al color. La calidad de la imagen est directamente relacionada con: - La cantidad de pixels y de lneas - El rango de los valores de brillo o de cada uno de los primarios d color ( f did d d l pixel) i i de l (profundidad del i l) Estos aspectos se conocen como resolucin de la imagen.

Silvia Castro

CG 2012

Primitivas de SalidaResolucin espacial de la Imagen

Imagen con resolucin espacial de 640 pixels x 640 lneas

Resolucin reducida a 1/2 128 pixels x 128 lneas

Resolucin reducida a 1/4 64 pixels x 64 lneas

Resolucin reducida a 1/8 32 pixels x 32 lneas

Resolucin reducida a 1/16 16 pixels x 16 lneas

Silvia Castro

CG 2012

14

Primitivas de SalidaResolucin de brillo de la Imagen

256 niveles de grises

128 niveles de grises

64 niveles de grises

32 niveles de grises

16 niveles de grises

8 niveles de grises

4 niveles de grisesSilvia Castro

2 niveles de grisesCG 2012

Primitivas de SalidaResolucin de Color de la Imagen

Colores de 4 bitsSilvia Castro

Colores de 8 bits

Colores de 24 bitsCG 2012

15

Primitivas de SalidaEn general, hablaremos en forma unificada de resolucin de brillo y resolucin de color y ste es el concepto de: Profundidad de un pixel se refiere a la cantidad de bits necesarios para representar un pixel pixel.

Imgenes de 1-bit son blancas y negras (por ej., line art). Las de pixels de 2-bits contienen cuatro variantes para cada pixel (00 01 10 11) y permiten una variacin de color de blanco a gris claro a gris oscuro y a negro.

Un pixel de 8-bits puede variar en el rango de 256 tonos de gris.Silvia Castro CG 2012

Primitivas de SalidaLas imgenes de 24 bits tienen 3 canales de 8 bits, uno para cada uno de los primarios.

Las imgenes de 32 bits tienen 4 canales de 8 bits; 3 de ellos p corresponden a cada uno de los primarios y el cuarto es el canal (alfa) o canal de transparencia. La cantidad de bits de una imagen se calcula entonces como:b = (cant. pixels a lo alto x cant. pixels a lo ancho ) x (prof. de c/pixel) = M*N*k = N2*kSilvia Castro CG 2012

16

Primitivas de SalidaEl mtodo usado para crear los valores muestreados puede afectar dramticamente la calidad de la imagen de salida. Si bien los algoritmos ms simples crean los valores de muestra dndole a cada pixel un valor de brillo constante, este proceso crea resultados que no son muy satisfactorios. Estas lneas dentadas son un ejemplo del aliasing. Idealmente necesitaramos una cantidad infinita de muestras para representar una forma geomtrica continua.

Silvia Castro

CG 2012

Primitivas de SalidaPara contrarrestar los efectos del aliasing, se usan mtodos de muestreo ms complejos. Se usan mtodos de pesado proporcional para asignar valores a cada pixel de modo tal que la lnea aparezca relativamente suave, aunque ello genere una lnea algo borrosa.

A este mtodo de contrarrestar los efectos de dentado se lo denomina de antialiasing.Silvia Castro CG 2012

17

Primitivas de SalidaVimos

Silvia Castro

CG 2012

Primitivas de SalidaQu hacemos entonces?

Silvia Castro

CG 2012

18

Primitivas de SalidaSupermuestreo de segmentos de rectas

Supermuestreo en posiciones de sub-pixel a lo largo del segmento de rectaSilvia Castro

Supermuestreo en posiciones de sub-pixel en relacin al interior de la lneaCG 2012

Primitivas de SalidaTcnicas de filtrado

Funciones de filtrado usadas para evitar el aliasing a lo largo de las lneas.Silvia Castro CG 2012

19

Primitivas de SalidaAntialiasing en los bordes de las reas rellenas

Ajuste de la intensidad de los pixels a lo largo del borde de un rea.Silvia Castro CG 2012

Primitivas de SalidaAntialiasing en los bordes de las reas

rea dividida a nivel de subpixel

Pixel subdividido

Lado que pasa por una seccin de la grillaSilvia Castro CG 2012

20

Primitivas de SalidaEjemplo en lneas

Silvia Castro

CG 2012

Primitivas de SalidaAliasing y antialiasing en lneas y polgonos

Ajuste de la intensidad de los pixels a lo largo del borde de la lnea.Silvia Castro CG 2012

21

Primitivas de SalidaAliasing y antialiasing en texto

Ajuste de la intensidad de los pixels a lo largo del borde de cada caracter.Silvia Castro CG 2012

Primitivas de SalidaAliasing y antialiasing en polgonos

Ajuste de la intensidad de los pixels a lo largo del borde de un rea.Silvia Castro CG 2012

22

Primitivas de SalidaAliasing en distintas primitivas involucradas en una animacin

Silvia Castro

CG 2012

Primitivas de SalidaAntialiasing en imgenes

Silvia Castro

CG 2012

23

Primitivas de SalidaAntialiasing en imgenes

Silvia Castro

CG 2012

Primitivas de SalidaAliasing y antialiasing en imgenes

Silvia Castro

CG 2012

24

Primitivas de EntradaLos dispositivos de entrada toman las seales generadas por el usuario y envan la informacin numrica correspondiente al programa grfico. Cada dispositivo transmite un tipo particular de datos (nmero, posicin, ). Los diferentes tipos de datos se denominan primitivas de entrada. Diferentes dispositivos fsicos pueden transmitir el mismo tipo de dato, es decir que generan la misma primitiva grfica.

Silvia Castro

CG 2012

Primitivas de EntradaLas primitivas grficas de entrada ms importantes son:- Locador: Retorna una posicin p - Valuador: Retorna un nmero en punto flotante - Pick: Retorna un ID de un objeto - Cadena: Retorna cadena de caracteres

Qu dispositivos fsicos pueden retornar cada una de estas primitivas grficas? i iti fi ? Tenga en cuenta: teclado, mouse, tableta grfica, joystick,

Silvia Castro

CG 2012

25

Bibliografa ACM SIGGRAPH Proceedings Angel, E., Shreiner, D. Interactive Computer Graphics: A top-down approach with shader-based OpenGL, Addison Wesley, 6th. Ed., 2011. Foley, J., van Dam, A., Feiner, S. y Hughes, J., Computer Graphics. Principles and Practice, Addison Wesley, 1992, 2nd Edition. Hearn, D., Baker, M.P., Computer Graphics, C Version, Prentice Hall Inc., 2003, 3rd Edition. Hill, F. Jr, Kelley, S., Computer Graphics Using OpenGL, Prentice Hall, 3rd Ed., 2006. Watt, A., Watt, M., Advanced Animation and Rendering Techniques: Theory and Practice, Addison-Wesley Publishing Company, 1993. Addison Wesley

Silvia Castro

CG 2012

26