Laboratorio 001: Herramientas de desarrollo de la Asignatura

09/05/2012 08:48 por Hernan Nina Hanco [ actualizado el 17/09/2012 14:47 ]

I) Objetivo Proporcionar al estudiante opciones de herramientas de desarrollo para el desarrollo de aplicativos en la asignatura de Computacin Grfica I. II) Marco conceptual Introduccin a OpenGL En OpenGL se proporciona una biblioteca bsica de funciones para especificar primitivas grficas, atributos, transformaciones geomtricas, transformaciones de visualizacin y muchas otras operaciones. Est diseada para ser independiente del hardware, por tanto, muchas operaciones, tales como las subrutinas de entrada y salida, no estn incluidas en la biblioteca bsica. Sin embargo, las subrutinas de entrada y salida y muchas funciones adicionales estn disponibles en bibliotecas auxiliares que se han desarrollado para programas OpenGL. Sintaxis bsica de OpenGL Los nombres de las funciones de la biblioteca bsica de OpenGL utiliza como prefijo gl. glBegin, glClear, glCopyPixels, glPolygonMode Todas las constantes comienzan con las letras GL en maysculas. GL_2D, GL_RGB, GL_CCW, GWOLYGON, GL_AMB I ENT_AND_D IFFUSE Las funciones de OpenGL tambin esperan tipos de datos especficos. Por ejemplo, GLbyte, GLshort, GLint, GLfloat, GLdouble, GLboolean. A algunos argumentos de funciones de OpenGL se les puede asignar valores empleando una matriz que enumera un conjunto de valores de datos. Esta opcin se utiliza para especificar una lista de valores como un puntero a una matriz, en lugar de especificar cada elemento de la lista explcitamente como un argumento. Un ejemplo tpico del uso de esta opcin es la especificacin de los valores de las coordenadas xyz. Bibliotecas relacionadas Existe un gran nmero de bibliotecas relacionadas para la realizacin de operaciones especiales, adems de la biblioteca bsica de OpenGL. La utilidad GLU (OpenGL Utility) proporciona subrutinas para la configuracin de las matrices de visualizacin y proyeccin, descripcin de objetos complejos mediante lneas y aproximaciones poligonales, visualizacin de cudricas y splines B empleando aproximaciones lineales, procesamiento de operaciones de representacin de superficies y otras tareas complejas. Toda implementacin de OpenGL incluye la biblioteca GLU. Todos los nombres de las funciones de GLU comienzan con el prefijo glu. Tambin existe un conjunto de herramientas orientadas a objetos basado en OpenGL, llamado Open Inventor que proporciona subrutinas y formas de objetos predefinidos para su uso en aplicaciones tridimensionales interactivas. Para crear grficos utilizando OpenGL, necesitamos en primer lugar configurar una ventana de visualizacin en nuestra pantalla de vdeo. Se trata simplemente de la zona rectangular de la pantalla en la que nuestra imagen se mostrar. No podemos crear directamente la ventana de visualizacin con las funciones de OpenGL bsicas, ya que esta biblioteca contiene nicamente funciones grficas independientes del dispositivo, y las operaciones de gestin de ventanas dependen de la computadora que estemos utilizando. Sin embargo, existen varias bibliotecas de sistema de ventanas que soportan las funciones de OpenGL en una gran variedad de mquinas. El kit de herramientas GLUT (OpenGL Utility Toolkit) proporciona una biblioteca de funciones para interactuar con cualquier sistema de ventanas. Las funciones de la biblioteca GLUT utilizan como prefijo glut. Esta biblioteca tambin contiene mtodos para describir y representar superficies y curvas cudricas. Programacin OpenGL en Java

OpenGL es compatible con principales sistemas operativos, funciona con cualquier sistema de ventanas, y se puede utilizar desde muchos lenguajes de programacin. Ofrece total independencia de los protocolos de red y topologas. En java existen APIs variadas que permite la escritura de aplicaciones OpenGL en java, por ejemplo las siguientes: Proyecto JOGL soportado por OpenGL API (JSR-231), JOGL provee un acceso completo a las APIs de OpenGL 1.3 - 3.0. Lightweight Java Game Library Java 3D Java 3D for Mac OS X OpenGL for Java (GL4Java) YAJOGLB jGL: a 3D graphics library for the Java III) Prcticas 1) Configuracin inicial de JOGL en Netbeans Esta prctica est destinado a practicar la implementacin JOGL desde sus inicios. Ayuda a configurar una instalacin reciente JOGL en Netbeans en Windows. En primer lugar se necesita descargar JOGL. se puede descargar los ltimos binarios JOGL de http://schabby.de/jogl-download/. Para esta prctica se utiliz los binarios: jogl-2.0-b752-20120504-windows-i586 gluegen-2.0-b552-20120504-windows-i586 Descargados estos archivos, debemos descomprimirlos y luego aadir a la librera de nuestra aplicacin en java los paquetes de clases Jar siguientes: gluegen-rt.jar gluegen-rt-natives-windows-i586.jar jogl.all.jar jogl-all-natives-windows-i586.jar

Una vez cargados estos Jar en la librera crear las Renderer y Ventana como se muestra en la

figura:

Clase Ventana

package geometrias.frontend; import import import import import import import geometrias.Renderer_Punto; java.awt.event.WindowAdapter; java.awt.event.WindowEvent; javax.media.opengl.GLCapabilities; javax.media.opengl.GLProfile; javax.media.opengl.awt.GLCanvas; javax.swing.JFrame;

/** * * @author hernan */ public class Ventana { public static void main(String[] args) { // 1. Configuracin de OpenGL Version 2 GLProfile profile = GLProfile.get(GLProfile.GL2); GLCapabilities capabilities = new GLCapabilities(profile); // 2. Canvas es el aplicativo grfico que se empotra en un JFrame GLCanvas glcanvas = new GLCanvas(capabilities); glcanvas.addGLEventListener(new Renderer_Punto()); glcanvas.setSize(400, 400); // 3. Crear la ventana para mostrar la aplicacin de dibujo JFrame frame = new JFrame("Aplicacin de OpenGL"); frame.getContentPane().add(glcanvas); // 4. Aadir el evento para cerrar la ventana frame.addWindowListener(new WindowAdapter() { @Override public void windowClosing(WindowEvent ev) { System.exit(0); } }); // 5. Cambiar el tamao de la ventana y visualizarla frame.setSize(frame.getContentPane().getPreferredSize()); frame.setVisible(true); } } Clase Renderer_Punto package geometrias; import import import import import /** java.util.logging.Level; java.util.logging.Logger; javax.media.opengl.GL2; javax.media.opengl.GLAutoDrawable; javax.media.opengl.GLEventListener;

* * @author hernan */ public class Renderer_Punto implements GLEventListener { static final Logger logger = Logger.getLogger("BasicLoggingExample"); // private GL2 gl; @Override public void init(GLAutoDrawable gLDrawable) { logger.log(Level.INFO, "mtodo - init"); // Provee un objeto que enlaza las APIs del OpenGL // Que se encargara de realizar las instrucciones de dibujos gl = gLDrawable.getGL().getGL2(); // 6. Especificar el color del dibujo: gris gl.glColor3f(0.5f, 0.5f, 0.5f); gl.glDrawBuffer(GL2.GL_FRONT_AND_BACK); } @Override public void reshape(GLAutoDrawable glad, int x, int y, int width, int height) { logger.log(Level.INFO, "Reshape"); // 7. Especificar el rea de dibujo (frame) utilizamos coordenadas gl.glMatrixMode(GL2.GL_PROJECTION); gl.glLoadIdentity(); gl.glOrtho(0, width, 0, height, -1.0, 1.0); } @Override public void display(GLAutoDrawable drawable) { logger.log(Level.INFO, "Display"); // 8. Especificar el dibujo de un punto gl.glPointSize(10); // Determina el tamao de un punto gl.glBegin(GL2.GL_POINTS); gl.glVertex2i(350, 350); gl.glEnd(); } @Override public void dispose(GLAutoDrawable glad) { throw new UnsupportedOperationException("Not supported yet."); } } Resultado:

IV) Tarea 1) En base a la aplicacin de la prctica modifique la aplicacin cambiar el color de la ventana a blanco. 2) Modificar el programa de la prctica para dibujar puntos aleatorios en la ventana. 3) Modificar el programa de la prctica para que el programa pueda solicitar al usuario coordenadas de puntos para que se dibujen en la ventana. V) Referencias JOGL in Eclipse: http://schabby.de/jogl-example-hello-world/ JOGL (Java OpenGL) Tutorial: http://www.land-of-kain.de/docs/jogl/ JogAmp: http://jogamp.org/ Ejemplos de Swing y JOGL: http://www.genedavissoftware.com/books/jogl/ljogl_ch2.html

VI) Solucin de Ejercicios Ejercicio 2: Modificar el programa de la prctica para dibujar puntos aleatorios en la ventana.

La Clase Ventana no varia, solo se cambiar el Renderer_Punto utilizado en anteriores programas, por esta nueva clase Renderer_Punto_Aleatorios. El mtodo Display es la que hace los dibujos en este caso dibuja puntos, se ha aadido un bucle for donde se genera puntos aleatorios con la el Math.Random y luego de ello se llama a un mtodo que dibujo un punto, de esta manera obtenemos el dibujo de puntos.

package geometrias.puntos; import java.util.logging.Level; import java.util.logging.Logger; import javax.media.opengl.GL import javax.media.opengl.GL2; import javax.media.opengl.GLAutoDrawable; import javax.media.opengl.GLEventListener; /** * * @author hernan */ public class Renderer_Punto_Aleatorios implements GLEventListener { static final Logger logger = Logger.getLogger("BasicLoggingExample"); // protected GL2 gl; @Override public void init(GLAutoDrawable gLDrawable) { logger.log(Level.INFO, "mtodo - init"); // Provee un objeto que enlaza las APIs del OpenGL // Que se encargara de realizar las instrucciones de dibujos gl = gLDrawable.getGL().getGL2(); // 6. Especificar el color del dibujo: Rojo gl.glColor3f(1.0f, 0.0f, 0.0f); gl.glDrawBuffer(GL2.GL_FRONT_AND_BACK); } @Override public void reshape(GLAutoDrawable glad, int x, int y, int width, int height) { logger.log(Level.INFO, "Reshape"); // 7. Especificar el rea de dibujo (frame) utilizamos coordenadas gl.glMatrixMode(GL2.GL_PROJECTION); gl.glLoadIdentity(); gl.glOrtho(0, width, 0, height, -1.0, 1.0); } @Override public void display(GLAutoDrawable drawable) { for (int i = 1; i <= 20; i++) { // 7. Generar un punto de coordenadas aleatorias double x = Math.random() * 400; double y = Math.random() * 400; // Especificar aleatoriamente el color de dibujo gl.glColor3d(Math.random(), Math.random(), Math.random()); gl.glPointSize(5); // Dibujar un punto dibujarPunto(x, y); } } protected void dibujarPunto(double x, double y) { gl.glBegin(GL.GL_POINTS); gl.glVertex2d(x, y); gl.glEnd(); } @Override public void dispose(GLAutoDrawable glad) { // throw new UnsupportedOperationException("Not supported yet."); } }

Resultado:

Ejercicio 3) Modificar el programa de la prctica para aadir un panel de ingreso de valores

de coordenadas x, y de un punto por el usuario, y en base a ello dibujar el punto correspondiente en la ventana. Para dar solucin a este problema vamos a generar una nueva ventana la cual lleva el siguiente diseo de la figura. Se requiere, dos paneles para visualizar el grfico de OpenGL y un panel de ingreso de datos.

El diseo lo desarrollamos en la siguiente clase: Ventana_Entrada package geometrias.frontend; import geometrias.puntos.Renderer_Punto_Entrada; import java.awt.Container; import java.awt.BorderLayout; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import javax.media.opengl.GLCapabilities; import javax.media.opengl.GLProfile; import javax.media.opengl.awt.GLCanvas; import javax.swing.JFrame; import javax.swing.JButton; import javax.swing.JPanel; import javax.swing.JLabel; import javax.swing.JTextField; import javax.swing.border.TitledBorder; import javax.swing.border.EtchedBorder; public class Ventana_Entrada extends JFrame implements ActionListener { // Atributos de Clase // objetos de swing private JPanel pOpenGL; private JPanel pEntrada; private JButton btnDibujar; private JTextField txtX; private JTextField txtY; // objetos de libreria JOGL private GLCanvas glCanvas; // Objeto graficador de un punto private Renderer_Punto_Entrada render_punto; public Ventana_Entrada() { inicializarVentana(); } // Inicializar la ventana private void inicializarVentana() { // habilita el botn cerrar de la ventana setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); // Crear un panel para ubicar el graficador Opengl pOpenGL = new JPanel(new BorderLayout()); pOpenGL.setBorder(new TitledBorder( new EtchedBorder(), // Tipo de Borde

"OpenGL")); // Ttulo del borde // Aadir el graficador al panel de OpenGL // 1. Configuracin de OpenGL Version 2 GLProfile profile = GLProfile.get(GLProfile.GL2); GLCapabilities capabilities = new GLCapabilities(profile); // 2. Canvas es el aplicativo grfico que se empotra en un JFrame - Ventana glCanvas = new GLCanvas(capabilities); render_punto = new Renderer_Punto_Entrada(); glCanvas.addGLEventListener(render_punto); pOpenGL.add(glCanvas); // Se aade el graficador OpenGL al panel glCanvas.setSize(500,500); // Crear el panel de entrada de datos pEntrada = new JPanel(); pEntrada.setBorder(new TitledBorder( new EtchedBorder(), // Tipo de Borde "Datos de grfico")); // Aadir controles JLabel lblX = new JLabel("X: "); txtX = new JTextField(5); JLabel lblY = new JLabel("Y: "); txtY = new JTextField(5); btnDibujar = new JButton("Dibujar"); // Aadir los controles al panel de entrada de datos pEntrada.add(lblX); pEntrada.add(txtY); pEntrada.add(lblY); pEntrada.add(txtX); pEntrada.add(btnDibujar); // hacer que el botn capte eventos cuando se hace click sobre l. btnDibujar.addActionListener(this); // Aadir los paneles en la ventana // Obtener el contenedor de componentes Container content = getContentPane(); content.add(pOpenGL, BorderLayout.CENTER); content.add(pEntrada, BorderLayout.SOUTH); // Mostrar ventana pack(); setVisible(true); } /* * Mtodo para tratar eventos en el formulario. */ @Override public void actionPerformed(ActionEvent e) { // Identificar el objeto o control donde se genero el evento Object source = e.getSource(); if (source == btnDibujar) { // si hay evento click en el botn // ubicar las nuevas coordenadas del punto int x = Integer.parseInt(txtX.getText()); int y = Integer.parseInt(txtY.getText()); // actualizar los valores de los puntos en el dibujador render_punto.setX(x); render_punto.setY(y); // repintar el nuevo punto glCanvas.repaint(); } } public static void main(String args[]) { // iniciar la ventana Ventana_Entrada ventana; ventana = new Ventana_Entrada(); } }

La siguiente clase denominada Renderer_Punto_Entrada, se aade dos atributos x,y que representan las coordenadas el punto, estos valores son utilizados para dibujar el punto. package geometrias.puntos; import java.util.logging.Level; import java.util.logging.Logger; import javax.media.opengl.GL; import javax.media.opengl.GL2; import javax.media.opengl.GLAutoDrawable; import javax.media.opengl.GLEventListener; /** * * @author hernan */ public class Renderer_Punto_Entrada implements GLEventListener { static final Logger logger = Logger.getLogger("BasicLoggingExample"); // protected GL2 gl; private int x; private int y; public Renderer_Punto_Entrada() { this.x = 0; this.y = 0; } public Renderer_Punto_Entrada(int x, int y) { this.x = x; this.y = y; } public int getX() { return x; } public void setX(int x) { this.x = x; } public int getY() { return y; } public void setY(int y) { this.y = y; } @Override public void reshape(GLAutoDrawable glad, int x, int y, int width, int height) { logger.log(Level.INFO, "Reshape"); // 7. Especificar el rea de dibujo (frame) utilizamos coordenadas gl.glMatrixMode(GL2.GL_PROJECTION); gl.glLoadIdentity(); gl.glOrtho(0, width, 0, height, -1.0, 1.0); } @Override public void display(GLAutoDrawable drawable) { gl.glClear(GL2.GL_COLOR_BUFFER_BIT); // Especificar aleatoriamente el color de dibujo gl.glColor3d(Math.random(), Math.random(), Math.random()); gl.glPointSize(10); // Dibujar un punto dibujarPunto(this.x, this.y); }

protected void dibujarPunto(double x, double y) { gl.glBegin(GL.GL_POINTS); gl.glVertex2d(x, y); gl.glEnd(); } @Override public void init(GLAutoDrawable glad) { logger.log(Level.INFO, "mtodo init"); // Provee un objeto que enlaza las APIs del OpenGL // Que se encargara de realizar las instrucciones de dibujos gl = glad.getGL().getGL2(); // 6. Especificar el color del dibujo: Rojo gl.glColor3f(1.0f, 0.0f, 0.0f); gl.glDrawBuffer(GL2.GL_FRONT_AND_BACK); } @Override public void dispose(GLAutoDrawable glad) { } }

Laboratorio 002: Algoritmos de dibujo de Lneas

06/06/2012 18:05 por Hernan Nina Hanco [ actualizado el 17/09/2012 14:46 ]
I) Objetivo Implementar algoritmos para el dibujo de lneas como parte de las primitivas geomtricas. II) Marco conceptual

Ver Gua de Computacin Grafica: Temas Algoritmos de dibujo de lneas III) Prcticas 1) Crear una aplicacin para dibujar una lnea con pendiente positiva y menor a 1. Utilizar varios mtodos. Se crea la clase Renderer_Punto. /* * Creado el 23 de mayo, 2012 por Hernn Nina Hanco * * Este trabajo es parte del proyecto CG1, que corresponde a la * implementacin de algoritmos de Dibujo de graficas. * * Universidad Nacional de San Antonio Abad del Cusco * Carrera Profesional de Ingeniera Informtica y de Sistemas * Asignatura: Computacin Grfica I */ package geometrias.lineas; /* * Dibujo de lneas con pendiente -1<m<1 * @author Hernan Nina Hanco */ import java.util.logging.Level; import java.util.logging.Logger; import javax.media.opengl.*; public class Renderer_Linea implements GLEventListener { static final Logger logger = Logger.getLogger("BasicLoggingExample"); protected GL2 gl; /*

* Inicializar graficador OpenGL */ @Override public void init(GLAutoDrawable gLDrawable) { logger.log(Level.INFO, "mtodo - init"); // Provee un objeto que enlaza las APIs del OpenGL // Que se encargara de realizar las instrucciones de dibujos gl = gLDrawable.getGL().getGL2(); // Color de fondo del GLCanvas gl.glClearColor(0.0f, 0.0f, 0.0f, 1.0f); gl.glClear(GL2.GL_COLOR_BUFFER_BIT); // definir el color del pincel gl.glColor3f(1.0f, 0.0f, 0.0f); } /* * Mtodo para actualizar el dibujo cuando, * se modifica el tamao de la ventana. */ @Override public void reshape(GLAutoDrawable glad, int x, int y, int width, int height) { logger.log(Level.INFO, "Reshape"); // 7. Especificar el rea de dibujo (frame) utilizamos coordenadas gl.glMatrixMode(GL2.GL_PROJECTION); gl.glLoadIdentity(); gl.glOrtho(-300, 300, -300, 300, -1.0, 1.0); // Dibujar un Sistema de Referencia. } /* * */ @Override public void dispose(GLAutoDrawable glad) { // no implementado } /* * Inicializar y presentar el dibujo de OpenGL */ @Override public void display(GLAutoDrawable drawable) { int x0, y0, xn, yn, dx, dy; // Establecer el tamao y color del punto gl.glPointSize(1); gl.glColor3f(0.0f, 0.0f, 1.0f); // Dibujo de Lneas de pendiente positiva y menor a 1 // utilizando diferentes mtodos // A) Dibujar una Lnea segn la ecuacin punto pendiente

lineaPuntoPendiente(50, 50, 290, 120); // B) Dibujar una Lnea utilizando el algoritmo de lnea DDA lineaDDA(50, 70, 290, 140); // C) Dibujar una Lnea utilizando el algoritmo de lnea de Bresenham lineaBresenham(50, 90, 290, 160); // D) Dibujar una Lnea utilizando el algoritmo de OpenGL lineaOpenGL(50, 110, 290, 180); } /* * Algoritmo DDA con pendiente -1<m<1 */ void lineaDDA(int x0, int y0, int xn, int yn) { int x; float m, y; // Calcular la pendiente m = (float) (yn - y0) / (xn - x0); x = x0; y = y0; // Tomar el intervalo del eje X y determinar Y while (x < xn + 1) { //Dibujar un punto en la coordenada X, Y dibujarPunto(x, Math.round(y)); /* Determinar el siguiente pixel */ x++; y += m; // el incremento es la pendiente } } /* * Algoritmo para el dibujo de Lnea con la ecuacin * punto pendiente con pendiente -1<m<1 */ void lineaPuntoPendiente(int x0, int y0, int xn, int yn) { int x; float m, b, y; // Calcular la pendiente y la constante b m = (float) (yn - y0) / (xn - x0); b = (float) (y0 - m * x0); x = x0; y = y0; // Tomar el intervalo del eje X y determinar Y while (x < xn + 1) { //Dibujar un pixel en la posicin X, Y dibujarPunto(x, Math.round(y)); x++; y = m * x + b; /* Ecuacin punto pendiente de la recta */ } } /* * Algoritmo para el dibujo de Lnea con el algoritmo de * Bresenham con pendiente -1<m<1 */

public void lineaBresenham(int x0, int y0, int xn, int yn) { // Identificar los valores x0,y0 int x = x0; int y = y0; // Calcular la constantes deltax, deltay, 2.deltay y 2deltay2deltax int deltax = xn-x0; int deltay = yn-y0; int incrA = 2*deltay; // incremento si Pk es menor a 0 int incrB = 2 * (deltay - deltax); int pk = 2*deltay-deltax; // calcular p0 // Tomar el intervalo del eje X y determinar Y while (x < xn + 1) { dibujarPunto(x, y); /* Escribir en el framebuffer */ /* Deteminar el siguiente pixel */ x++; if (pk < 0) { pk += incrA; } else { y++; pk += incrB; } } } /* * Algoritmo para el dibujo de Lnea con el algoritmo implementado * por OpenGL considere la pendiente -1<m<1 */ void lineaOpenGL(int x0, int y0, int xn, int yn) { // Determinar el grosor de la lnea gl.glLineWidth(1.0f); // Activar el estado de dibujo de lneas gl.glBegin(GL2.GL_LINES); // Establecer el punto inicial y final gl.glVertex2i(x0, y0); gl.glVertex2i(xn, yn); gl.glEnd(); } /* * Dibujar un punto */ protected void dibujarPunto(int x, int y) { gl.glBegin(GL.GL_POINTS); gl.glVertex2i(x, y); gl.glEnd(); } } Resultado de la aplicacin, utilice la clase Ventana del Laboratorio 1, para mostrar los resultados.

IV) Tarea 1) Modifique el programa anterior para dibujar un sistema de coordenadas como se muestra en la Figura.

2) Modificar el programa de la prctica donde se modifique los algoritmos de dibujo de lnea para el dibujo de lneas con pendiente arbitraria. 3) Modificar el programa de la prctica que considere el ingreso por parte del usuario, los extremos de una lnea recta. 4) Evalu el tiempo de ejecucin de los algoritmos de dibujo de lneas, considere tabulacin de datos y grficas. (Ayuda: Tiempo en nanosegundo en java se obtiene con la sentencia):

long tiempo = System.nanoTime();

Laboratorio 003: Algoritmos de dibujo de crculos y elipses

27/06/2012 17:55 por Hernan Nina Hanco [ actualizado el 17/09/2012 14:46 ]
I) Objetivo Implementar algoritmos para el dibujo de crculos y elipses descritos en la teora de la asignatura. II) Marco conceptual

Ver Gua de Computacin Grafica: Temas Algoritmos de dibujo de Crculos y Elipses III) Prcticas 1) Implementar una clase para dibujar el octante de un Crculo con el algoritmo de la ecuacin cannica y el punto medio. Adems dibujar un circulo con las ecuaciones polares del circulo. /* * Creado el 23 de mayo, 2012 por Hernn Nina Hanco * * Este trabajo es parte del proyecto CG1, que corresponde a la * implementacin de algoritmos de Dibujo de graficas. * * Universidad Nacional de San Antonio Abad del Cusco * Carrera Profesional de Ingeniera Informtica y de Sistemas * Asignatura: Computacin Grfica I */ package geometrias.curvas; /* * Dibujo de lneas con pendiente -1<m<1 * @author Hernan Nina Hanco */ import java.util.logging.Level; import java.util.logging.Logger; import javax.media.opengl.*; public class Renderer_Circulo implements GLEventListener { static final Logger logger = Logger.getLogger("BasicLoggingExample"); protected GL2 gl; /* * Inicializar graficador OpenGL */ @Override public void init(GLAutoDrawable gLDrawable) { logger.log(Level.INFO, "mtodo - init"); // Provee un objeto que enlaza las APIs del OpenGL // Que se encargara de realizar las instrucciones de dibujos gl = gLDrawable.getGL().getGL2();

// Color de fondo del GLCanvas gl.glClearColor(1.0f, 1.0f, 1.0f, 1.0f); gl.glClear(GL2.GL_COLOR_BUFFER_BIT); // definir el color del pincel gl.glColor3f(1.0f, 0.0f, 0.0f); } /* * Mtodo para actualizar el dibujo cuando, * se modifica el tamao de la ventana. */ @Override public void reshape(GLAutoDrawable glad, int x, int y, int width, int height) { logger.log(Level.INFO, "Reshape"); // 7. Especificar el rea de dibujo (frame) utilizamos coordenadas gl.glMatrixMode(GL2.GL_PROJECTION); gl.glLoadIdentity(); gl.glOrtho(-300, 300, -300, 300, -1.0, 1.0); // Dibujar un Sistema de Referencia. // dibujarSistemaReferencia(-300, 300, -300, 300); } /* * */ @Override public void dispose(GLAutoDrawable glad) { // no implementado } /* * Inicializar y presentar el dibujo de OpenGL */ @Override public void display(GLAutoDrawable drawable) { int x0, y0, xn, yn, dx, dy; // Establecer el tamao y color del punto gl.glPointSize(1); gl.glColor3f(0.0f, 0.0f, 1.0f); // Dibujo de Circulos // utilizando diferentes mtodos // Se realiza el dibujo en el segundo octante // A) Dibujar un Crculo segn la ecuacin Cannica dibujarCirculoCanonica(200, 0, 0); // B) Dibujar un Crculo segn la ecuacin parmetrica polar dibujarCirculoPolar(150,0,0); // C) Dibujar un Crculo segn el algoritmo de punto medio dibujarCirculoPuntoMedio(100,0,0); // D) Dibujar un Crculo segn el algoritmo implementado por OpenGL

} /* * Algoritmo de dibujo de un Crculo basado en la ecuacin Cannica */ void dibujarCirculoCanonica(int r, int xc, int yc) { int x = 0; int y = r; while (x <= y) { this.dibujarPunto(x + xc, y + yc); x++; double yd = Math.sqrt(r * r - x * x); y = (int) Math.round(yd); } } /* * Algoritmo para el dibujo de crculo basado en la ecuacin parmetrica * polar de la circunferencia. */ void dibujarCirculoPolar(int r, int xc, int yc) { // Determinar el angulo de variacin double theta = Math.toRadians(0); // Punto inicial int x = r; int y = 0; // Mientras el angulo no exceda a 360 dibujar puntos while (theta <= 2*Math.PI) { this.dibujarPunto(x + xc, y + yc); // Incrementar el ngulo theta=theta+Math.toRadians(5); // Clcular los valores x e y de forma parmetrica double xd = r * Math.cos(theta); x = (int) Math.round(xd); double yd = r * Math.sin(theta); y = (int) yd; } } /* * Algoritmo para el dibujo de Crculo con el algoritmo de * punto medio */ public void dibujarCirculoPuntoMedio(int r, int xc, int yc) { // Punto inicial del crculo int x = 0; int y = r; // Clcular el parmetro inicial de decisin int pk = 1-r; // verificar el pk para determinar las posiciones de pixel siguuientes while (x<=y) {

System.out.println("(x,y)= "+x+","+y+" pk="+pk); dibujarPunto(xc+x,yc+y); if (pk<0){ pk+=2*(x+1)+1; x++; } else // pk>=0 { pk+=2*(x+1)+1 - 2*(y-1); x++; y--; } } } /* * Algoritmo para el dibujo de Crculo con el algoritmo implementado * por OpenGL. */ void dibujarCirculoOpenGL(int r, int xc, int yc) { } /* * Dibujar un punto */ protected void dibujarPunto(int x, int y) { gl.glPointSize(2); gl.glBegin(GL.GL_POINTS); gl.glVertex2i(x, y); gl.glEnd(); } } Resultado de la aplicacin:

IV) Tarea 1) Modificar la implementacin de la prctica para completar el dibujo de los dems octantes del crculo, en los mtodos respectivos. 2) Cree una clase Renderer_Elipse donde dibuje una elipse utilizando la ecuacin general, ecuaciones paramtricas polares y punto medio.

Laboratorio 004: Relleno poligonal

publicado 14:45 ] 05/07/2012 05:15 por Hernan Nina Hanco [ actualizado el 17/09/2012

I) Objetivo Implementar algoritmos de relleno poligonal descritos en la teora de la asignatura. II) Marco conceptual

Ver Gua de Computacin Grfica III) Prcticas

1) Dibujar un polgono utilizando polilineas cerradas. Clase Renderer_RellenoPoligonal

/*

* Creado el 23 de mayo, 2012 por Hernn Nina Hanco * * Este trabajo es parte del proyecto CG1, que corresponde a la * implementacin de algoritmos de Dibujo de graficas. * * Universidad Nacional de San Antonio Abad del Cusco * Carrera Profesional de Ingeniera Informtica y de Sistemas * Asignatura: Computacin Grfica I */ package geometrias.rellenoareas; /* * Dibujo de lneas con pendiente -1<m<1 * @author Hernan Nina Hanco */ import import import import import java.util.ArrayList; java.util.List; java.util.logging.Level; java.util.logging.Logger; javax.media.opengl.*;

public class Renderer_RellenoPoligonal implements GLEventListener { static final Logger logger = Logger.getLogger("BasicLoggingExample"); protected GL2 gl; /* * Inicializar graficador OpenGL */ @Override public void init(GLAutoDrawable gLDrawable) { logger.log(Level.INFO, "mtodo - init"); // Provee un objeto que enlaza las APIs del OpenGL // Que se encargara de realizar las instrucciones de dibujos gl = gLDrawable.getGL().getGL2(); // Color de fondo del GLCanvas gl.glClearColor(1.0f, 1.0f, 1.0f, 1.0f); gl.glClear(GL2.GL_COLOR_BUFFER_BIT); // definir el color del pincel gl.glColor3f(1.0f, 0.0f, 0.0f); } /* * Mtodo para actualizar el dibujo cuando, * se modifica el tamao de la ventana. */ @Override public void reshape(GLAutoDrawable glad, int x, int y, int width, int height) { logger.log(Level.INFO, "Reshape"); // 7. Especificar el rea de dibujo (frame) utilizamos coordenadas

gl.glMatrixMode(GL2.GL_PROJECTION); gl.glLoadIdentity(); gl.glOrtho(-width, width, -height, height, -1.0, 1.0); } @Override public void dispose(GLAutoDrawable glad) { // no implementado } /* * Inicializar y presentar el dibujo de OpenGL */ @Override public void display(GLAutoDrawable drawable) { // Establecer el tamao y color del punto gl.glPointSize(1); gl.glColor3f(0.0f, 0.0f, 1.0f); // Dibujar polilinea cerrada List<Punto> vertices = new ArrayList<Punto>(); vertices.add(new Punto(0, 0, 0)); vertices.add(new Punto(100, 0, 0)); vertices.add(new Punto(200, 100, 0)); vertices.add(new Punto(300, 0, 0)); vertices.add(new Punto(300, 300, 0)); vertices.add(new Punto(0, 300, 0)); dibujarPolilineasCerrada(vertices); // Identificar poligono concavo // identificarPoligonoConcavo(); } /* * Dibujar un poligono utilizando polilinea cerrada */ private void dibujarPolilineasCerrada(List<Punto> vertices) { int numeroVertices = vertices.size(); for (int i = 0; i < numeroVertices - 1; i++) { int x0 = vertices.get(i).getX(); int y0 = vertices.get(i).getY(); int xn = vertices.get(i + 1).getX(); int yn = vertices.get(i + 1).getY(); lineaBresenham(x0, y0, xn, yn); } // cerrar la figura int x0 = vertices.get(numeroVertices - 1).getX(); int y0 = vertices.get(numeroVertices - 1).getY(); int xn = vertices.get(0).getX(); int yn = vertices.get(0).getY(); lineaBresenham(x0, y0, xn, yn); } /* * Dibujar lnea arbitraria con metodo bresenham */ public void lineaBresenham(int x0, int y0, int xn, int yn) { int dx, dy, incrE, incrNE, d, x, y, flag = 0;

if (xn < x0) { //intercambiar(x0,xn); int temp = x0; x0 = xn; xn = temp; //intercambiar(y0,yn); temp = y0; y0 = yn; yn = temp; } if (yn < y0 = yn = flag } y0) { -y0; -yn; = 10;

dy = yn - y0; dx = xn - x0; if (dx < dy) { //intercambiar(x0,y0); int temp = x0; x0 = y0; y0 = temp; //intercambiar(xn,yn); temp = xn; xn = yn; yn = temp; //intercambiar(dy,dx); temp = dy; dy = dx; dx = temp; flag++; } x = x0; y = y0; d = 2 * dy - dx; incrE = 2 * dy; incrNE = 2 * (dy - dx); while (x < xn + 1) { escribirPixel(x, y, flag); /* Dibujar punto */ x++; /* siguiente pixel */ if (d <= 0) { d += incrE; } else { y++; d += incrNE; } } }

void escribirPixel(int x, int y, int flag) { int xf = x, yf = y; if (flag == 1) { xf = y; yf = x; } else if (flag == 10) { xf = x; yf = -y; } else if (flag == 11) { xf = y; yf = -x; } dibujarPunto(xf, yf); } /* * Dibujar un punto */ protected void dibujarPunto(int x, int y) { gl.glPointSize(2); gl.glBegin(GL.GL_POINTS); gl.glVertex2i(x, y); gl.glEnd(); } }

Resultado: IV) Tarea 1) Implementar un mtodo para Identificar si el polgono es cncavo o convexo. 2) Si en caso fuese el polgono cncavo dividir el mismo en polgonos convexos. Desarrolle un mtodo para representar grficamente la divisin 3) Una vez que se identifiquen los polgonos convexos, implementar el mtodo para dividirlo en tringulos. Muestre grficamente el resultado

Laboratorio 005: Atributos de primitivas

17/07/2012 12:43 por Hernan Nina Hanco [ actualizado el 17/09/2012 14:45 ]
I) Objetivo Implementar algoritmos de atributos de primitivas de Puntos, Lneas, Curvas y Caracteres. II) Marco conceptual

Ver Gua de Computacin Grfica III) Prcticas

1) Grosor de punto.

IV) Tarea
Implementar una aplicacin para dibujar lneas arbitrarias con un determinado grosor de Lnea. Modifique la aplicacin anterior para evitar las puyas en las lneas de grosor utilizando extremos cuadrado, redondeado, etc. Implementar una aplicacin para dibujar polilineas de un determinado grosor de lnea evitar los huecos en las esquinas. Implementar una aplicacin para dibujar una circunferencia con un derminado grosor de lnea. Implementar una aplicacin para dibujar una elipse con un derminado grosor de lnea.

Laboratorio 006: Transformaciones Geomtricas 2D Bsicas

publicado 14:44 ] 19/07/2012 08:50 por Hernan Nina Hanco [ actualizado el 17/09/2012

I) Objetivo Implementar transformaciones geomtricas 2D bsicas de traslacin, rotacin y escalamiento de Poligonos. II) Marco conceptual

Ver Gua de Computacin Grfica III) Prcticas

1) Dibujar un poligono. IV) Tarea

Implementar un programa para realizar la traslacin, rotacin y escalamiento de una figura poligonal.

Laboratorio 007: Transformaciones de escalonado en punto fijo y rotaciones en punto pivot

14/08/2012 12:54 por Hernan Nina Hanco [ actualizado el 17/09/2012 14:45 ]
I) Objetivo Implementar operaciones de transformado de escalamiento en punto fijo y rotaciones en punto pivot. II) Marco conceptual

Ver Gua de Computacin Grfica III) Prcticas

1) Dibujar un poligono. IV) Tarea

Implementar un programa para realizar las operaciones de transformacin.

Laboratorio 008: Transformaciones compuestas

publicado 14:44 ] 14/08/2012 12:55 por Hernan Nina Hanco [ actualizado el 17/09/2012

I) Objetivo Implementar los operadores para transformaciones compuestas utilizando matrices homogneas. II) Marco conceptual

Ver Gua de Computacin Grfica III) Prcticas

1) Dibujar un poligono. IV) Tarea

Aplicar las operaciones para transformaciones compuestas.

Laboratorio 009: Reflexiones e Inclinaciones

14/08/2012 12:56 por Hernan Nina Hanco [ actualizado el 17/09/2012 14:44 ]
I) Objetivo Implementar transformaciones de inclinacin y reflexin considerando casos de ejes bsicos y genricos. II) Marco conceptual

Ver Gua de Computacin Grfica III) Prcticas

1) Dibujar un poligono. IV) Tarea

Demostraciones de reflexiones

Laboratorio 010: Algoritmos de Recorte

10/09/2012 19:57 por Hernan Nina Hanco [ actualizado el 17/09/2012 14:43 ]
I) Objetivo Implementar los algoritmos de recorte. II) Marco conceptual

Ver Gua de Computacin Grfica III) Prcticas

1) Dibujar un poligono. IV) Tarea

Implementar Algoritmos de recorte.