Módulo Computación Gráfica PDF

– UNAD
UNIVERSIDAD NACIONAL ABIERTA Y A DISTANCIA

Escuela de Ciencias Básicas, Tecnología e Ingeniería
Ingeniería de Sistemas Módulo del curso Computación Gráfica
ESCUELA DE CIENCIAS BÁSICAS, TECNOLOGÍA E INGENIERÍA
MODULO DEL CURSO ACADÉMICO

COMPUTACIÓN GRÁFICA
299210
OSCAR JAVIER ABAUNZA GARCÍA

Director Nacional
Bucaramanga, Julio de 2012

– UNAD
UNIDAD 1 FUNDAMENTOS DE COMPUTACIÓN GRÁFICA.............................................. 9

CAPÍTULO 1 Evolución de la computación gráfica......................................................... 11
Lección 1 Anticipando la tecnología ............................................................................ 11
Lección 2 Los primeros aportes .................................................................................. 13
Lección 3 Teorías y planteamientos............................................................................ 15

Lección 4 La revolución .............................................................................................. 18
Lección 5 Cronología en el desarrollo de la computación gráfica ............................... 19
CAPÍTULO 2 Fundamentos de computación gráfica ...................................................... 23
Lección 6 Tipos de graficación computacional ............................................................ 23
Lección 7 Sistema de coordenadas ............................................................................ 27
Lección 8 Introducción a la teoría del color ................................................................. 29
Lección 9 Modelos de color ........................................................................................ 33
Lección 10 Representación del color en computación gráfica..................................... 37
CAPÍTULO 3 El hardware y el software para computación gráfica .................................41
Lección 11 Dispositivos de vectores ...........................................................................43
Lección 12 Dispositivos de ráster ............................................................................... 44
Lección 13 Hardware gráfico para monitores - La tarjeta de video .............................. 45
Lección 14 Dispositivos de entrada............................................................................. 48
Lección 15 Software de graficación ............................................................................ 51
UNIDAD 2 ALGORITMOS BÁSICOS DE DIBUJO EN 2 DIMENSIONES .......................... 58
CAPÍTULO 4 Requerimientos de software ..................................................................... 60
Lección 16 JDK........................................................................................................... 60
Lección 17 Estructura básica de un programa en JAVA ............................................. 62
Lección 18 Tipos de datos y variables ........................................................................63
Lección 19 IDE para JAVA ......................................................................................... 64
Lección 20 Compilación y ejecución ...........................................................................69
CAPÍTULO 5 Algoritmos básicos.................................................................................... 71
Lección 21 Especificación de una discretización......................................................... 71
Lección 22 Segmentos de recta.................................................................................. 72
Lección 23 Discretización de circunferencias.............................................................. 78
Lección 24 Dibujo de polígonos .................................................................................. 80
Lección 25 Llenado de áreas ...................................................................................... 83
– UNAD
CAPÍTULO 6 Transformaciones ..................................................................................... 84

Lección 26 Breve repaso sobre matrices .................................................................... 85
Lección 27 Cambios de escala ................................................................................... 87
Lección 28 Rotación ................................................................................................... 88
Lección 29 Coordenadas homogéneas y traslación.................................................... 90
Lección 30 Rotación alrededor de un punto................................................................ 92
UNIDAD 3 TRABAJANDO CON UN API GRÁFICA ........................................................... 96
CAPÍTULO 7 Fundamentos del API 2D de JAVA ........................................................... 99
Lección 31 Características generales del API 2D de Java .......................................... 99
Lección 32 Ubicación espacial, textos e imágenes ................................................... 103
Lección 33 Rellenos, Filetes y Composiciones ......................................................... 108
Lección 34 Los paquetes del API 2D de Java ........................................................... 110
Lección 35 La clase Graphics ................................................................................... 113
CAPÍTULO 8 API 3D de JAVA ..................................................................................... 117
Lección 36 Figuras básicas en Java 2D (Shape) ...................................................... 117
Lección 37 Áreas ...................................................................................................... 129

Lección 38 Texto y Fuentes ...................................................................................... 133
Lección 39 Imágenes................................................................................................ 140
Lección 40 Técnica de Doble Búfer .......................................................................... 147
CAPÍTULO 9 API 3D de JAVA ..................................................................................... 154
Lección 41 Lo básico de Java 3D ............................................................................. 155
Lección 42 Empezar con Java 3D ............................................................................ 155
Lección 43 Un Ejemplo de la aplicación de la receta ................................................ 169
Lección 44 Rotación de objetos ................................................................................ 175
Lección 45 Añadir Comportamiento de Animación.................................................... 183
– UNAD
ASPECTOS DE PROPIEDAD INTELECTUAL Y VERSIONAMIENTO
El contenido didáctico del curso académico Computación Gráfica fue diseñado

inicialmente en el año 2005 por Adriana rocío Lizcano Dallos, docente de la UNAD,
Bogotá, ingeniera de sistemas, en su desempeño como tutora.
Se han realizado las siguientes actualizaciones al contenido didáctico:
 Adecuación del diseño según plantilla material didáctico UNAD.
 Distribución de unidades, capítulos y lecciones según el estándar CORE.
 Adición del capítulo 4 Requerimientos de software.
 Actualización de herramientas para el desarrollo, codificación y librerías.
Estos cambios fueron realizados por Oscar Javier Abaunza García, docente de la
UNAD, CEAD Bucaramanga, ingeniero de sistemas, especialista en educación
superior a distancia, en su desempeño como tutor y director del curso a nivel
nacional.
– UNAD
INTRODUCCIÓN
Gracias a la paranoia de la Guerra Fría, el Departamento de Defensa de Estados

Unidos creó la Agencia de Proyectos de Investigación Avanzada (ARPA, por sus
siglas
varios en inglés).
centros En torno adeesta
académicos organización,
Estados Unidos jóvenes ingenieros
para lograr que la trabajaron en
computación
dejara de ser un campo reservado a expertos, como lo era a mediados del siglo
XX. Efectivamente, a inicios de la década de los sesenta, la computación ya se
había abierto un poco a las universidades, pero seguía siendo asunto de una élite.
Sin embargo, a principios de la siguiente década, la computación se convirtió en
una industria y comenzó a perfilarse como una subcultura.
El equipo que durante varios años fue auspiciado por el ARPA estuvo dirigido por
Douglas C. Engelbart. El concepto de microcomputadora actual surgió de aquel
grupo; Engelbart insistía en que las nuevas computadoras debían poder ser
utilizadas por personas no especialistas. Para ello, fue necesario el desarrollo e
integración de la computación gráfica, la computación interactiva y la de tiempo
compartido.
Ivan Sutherland, del Lincoln Laboratory del MIT y parte del grupo de Engelbart,
desarrolló el campo de la computación gráfica, es decir, la incorporación de una
pantalla a una computadora. En 1962, creó el primer sistema de interfaz gráfica, el
Sketchpad. Poco después, la computadora DEC-PDP-1, financiada por la DEC
(Digital Equipment Corporation), y diseñada por ingenieros del MIT, fue la primera
microcomputadora que mostraba información en una pantalla. Atrás quedaba la
penosa comunicación con la computadora por medio de tarjetas y cintas que
confundía la interpretación y requería de un especialista en todo momento.
El segundo concepto, el de la computación interactiva, se refiere al uso de una
computadora en tiempo real; es decir, durante los primeros años de la década de
los sesenta, en paralelo a la evolución de la computación gráfica, se desarrollaron
las técnicas que permitieron que las computadoras pudieran usarse como un
músico lo hace
su operación. Lacon su instrumento:
intención al tiempo
fue dejar atrás que lo toca
la mecánica escucha
de uso el resultado
asincrónica, de
al menos
en tres tiempos: el acceso de información y/o programas por medio de tarjetas y
cintas perforadas, el lapso de espera mientras la máquina procesaba, y la salida de
resultados también en forma impresa. La computación interactiva se desarrolló
fundamentalmente en el Instituto de Investigaciones de la Universidad de Stanford.
En tercer lugar, también durante los años 60, surge la computación de tiempo
compartido, el sistema por medio del cual una misma computadora puede dar
servicio a muchas personas, a través de terminales. La trascendencia de la
computación de tiempo compartido estriba en que gracias a dicha forma de trabajo
– UNAD
se desarrollaron una serie de técnicas encaminadas a permitir la transmisión de

información –comunicación- entre los usuarios; ejemplo derivado de ello es el
correo electrónico.
Finalmente, durante una conferencia de cómputo celebrada en San Francisco,
California, en 1968, el propio Douglas C. Engelbart presentó el resultado de la
integración del trabajo de los equipos financiados por ARPA: el primer sistema
computacional que incluía teclado, tablero, mouse, monitor y ventanas
desplegables (interfaz gráfica).
La interfaz gráfica de usuario fue mejorada enormemente a partir de 1971 en Xerox
y poco después en el MIT. Una década más tarde, estos esfuerzos culminaron en
un producto real, cuando Steve Jobs tuvo la sabiduría para introducir la Macintosh,
un microcomputador que permitía interactuar fácilmente utilizando ventanas y
donde era posible ejecutar una aplicación con un clic del ratón, este fue el principal
paso hacia adelante en el mercado y, en comparación con ese avance, desde
entonces no ha sucedido nada importante. Copiar la Mac de Apple les llevó más de
cinco años a todas las demás empresas.
Aun cuando el sistema gráfico de interacción por ventanas ya no es una novedad,
los desarrollos en la representación de gráficos mediante el computador se han
multiplicado a diversidad de campos: los juegos interactivos, la realidad virtual, las
simulaciones gráficas de procesos químicos, físicos y matemáticos, el cine, el
diseño asistido por computador y hasta el arte.
Pero detrás de toda la parafernalia de hardware y de la complejidad del software
para realizar representaciones en 2D y 3D, se encuentran un conjunto de principios
matemáticos y algoritmos que la sustentan. Todo inicia con el punto y la recta,
desde allí es posible generar la multiplicidad de aplicaciones que hoy en día
impactan y hacen pensar en una realidad paralela por su expresión y realismo.
Con el fin de proporcionar a los estudiantes de ingeniería de sistemas la posibilidad
de conocer estos fundamentos matemáticos y algorítmicos, que hacen posible la
representación gráfica en el computador, es que la Facultad de Ciencias básicas e
Ingeniería de la UNAD presenta el curso de Computación Gráfica. Este curso tiene
asignados 3 créditos académicos y corresponde al campo de formación Electivo del
Programa de Ingeniería de sistemas. Tiene un carácter teórico-metodológico pues
la pretensión principal está encaminada a que usted conozca los fundamentos de la
graficación, especialmente en dos dimensiones, además de realizar un trabajo de
uso de las posibilidades que proporcionan las API gráficas, en este caso las que
proporciona el lenguaje de programación Java para el dibujo. Este lenguaje fue
seleccionado dado su carácter de libre distribución y la amplia gama de
posibilidades que proporciona para la graficación tanto en dos como en tres
dimensiones.
Este curso, le proporcionará una base conceptual sólida para que posteriormente a
través del aprendizaje autónomo usted emprenda la profundización y la práctica en
– UNAD
el aprendizaje de otras herramientas de graficación, lo mismo que el desarrollo de

gráficos que puedan ser útiles en múltiples campos de desempeño, como los
mencionados en párrafos anteriores.
A través del desarrollo de las diferentes unidades temáticas usted conocerá los
fundamentos conceptuales de la graficación en computador, así como los
elementos matemáticos y algorítmicos para dibujar gráficos en dos y tres
dimensiones. También adquirirá las destrezas necesarias para utilizar las
facilidades proporcionadas por una API gráfica.
Para lograrlo se ha estructurado el curso en tres unidades didácticas: Fundamentos
de computación gráfica, Algoritmos básicos de dibujo en dos dimensiones y
Trabajando con un API gráfica.
En la unidad de Fundamentos de computación gráfica se estudiará su concepto y
evolución, el hardware y software necesario para realizar desarrollos en
computación gráfica con altas especificaciones, los principales tipos de graficación,
la terminología comúnmente utilizada y se presentarán algunas consideraciones
sobre el manejo del color y su representación computacional.
En Algoritmos básicos de dibujo en dos dimensiones se plantean los fundamentos
para la creación de líneas, círculos, llenado de áreas y polígonos, además de
conocer los aspectos sobre el manejo de coordenadas espaciales en el
computador. En esta unidad se realizarán prácticas en los computadores con el fin
de realizar pequeños desarrollos gráficos utilizando principios básicos de dibujo del
lenguaje Java.
Finalmente, en la unidad correspondiente a Trabajando con un API gráfica se
presentan las principales clases y algunos ejemplos que muestran las posibilidades
que ofrecen este tipo de interfaces para la creación de programas que requieren el
tratamiento de gráficos. Para ello se asume el estudio del API 2D y del API 3D de
Java a partir de las presentación y comentario de ejemplos.
Para el desarrollo de las diferentes unidades del Módulo del curso Computación
Gráfica se ha intentado recopilar la información más relevante y actualizada,
organizándola de forma coherente y didáctica,... por lo menos es la esperanza de la
autora
actual. que
Se hael puesto
lector encuentre en estaenrecopilación
especial interés un material
asegurar fuentes agradable,
de calidad, pueslegible
aunquey
la principal fuente de consulta es internet, se han seleccionado los materiales de
fuentes reconocidas que se podrán identificar y consultar en la sección final de
cada Unidad didáctica. Se ha acudido especialmente a traducciones de los
tutoriales y documentación proporcionada por Sun Microsystems y por reconocidos
autores del área.
Cada unidad didáctica está estructurada en tres componentes básicos, la
presentación de la Unidad, el desarrollo temático y las fuentes relacionadas. La
presentación de la Unidad incluye la introducción, intencionalidades formativas,
– UNAD
mapa conceptual y productos de aprendizaje, con el fin de recordar y orientar el

estudio de la misma. Estos componentes también los podrá encontrar en la Guía
didáctica del curso. Posteriormente se encuentra el desarrollo de los diferentes
temas, en algunos casos se proporcionan recomendaciones para la ampliación del
tema mediante consultas en Internet y se suministran las direcciones
recomendadas de búsqueda y lectura. Se espera que el estudiante asuma el
estudio independiente de los diferentes temas, mediante lectura autorregulada y
construyendo mapas conceptuales, fichas de lectura y de conceptos, las cuales
deberá archivar en el portafolio personal. Finalmente, las fuentes relacionadas
reconocen todas las fuentes utilizadas para la recopilación y redacción del
contenido temático.
Además, como material de consulta adicional se recomienda que usted acceda a
otros recursos documentales como la biblioteca de la Universidad
(www.unad.edu.co), enlaces internet (que se proporcionan en cada unidad del
módulo), bases de datos como ProQuest a los que se tiene acceso gratuito desde
las salas de informática de la UNAD.
Este módulo no aborda toda la extensión de algoritmos y tópicos de la computación
gráfica, pero si compendia los conceptos fundamentales que le faciliten una
profundización posterior, según los intereses del lector.
Como es de esperarse, este módulo es una primera aproximación que se espera

enriquecer con los aportes de los tutores y estudiantes que a nivel nacional
desarrollen el curso, es por tanto no solo fuente de consulta, sino también material
de discusión para el mejoramiento de los procesos de aprendizaje de la
Universidad Nacional Abierta y a Distancia.
– UNAD
UNIDAD 1 FUNDAMENTOS DE COMPUTACIÓN GRÁFICA

Introducción
Al comienzo todo era tinieblas. El procesamiento en el computador se realizaba en
lotes, cargando innumerables tarjetas perforadas y ejecutando un único programa
a la vez, cuya salida solamente era visible en el formato impreso. La necesidad de
hacer
personas posible el uso de fue
no especialistas esteel sofisticado elemento
aliciente para (el gran computador)
que los investigadores por
de múltiples
institutos y universidades plantearan la posibilidad de realizar un computador con
una pantalla de monitor que permitiera visualizar los datos de diferentes formas, al
igual que dispositivos que hicieran posible la interacción humano-máquina de forma
intuitiva. Aparece entonces la idea de la computación gráfica.
Después de esto, su evolución vertiginosa está estrechamente relacionada con dos
componentes: el mundo de los videojuegos y del cine animado. De hecho, los
grandes ejemplos de los logros en los algoritmos, hardware y software para diseño
asistido por computador son en su mayoría de estas áreas de trabajo.
Esta primera unidad busca familiarizarlo con la evolución del concepto de
computación gráfica, los diferentes hitos que marcan su historia y algunos
conceptos fundamentales necesarios para su efectivo estudio.
Intencionalidades Formativas
Propósitos
Aportar a la fundamentación teórica del estudiante, como base para la
construcción de un discurso coherente y sustentado, a través de la
profundización en la terminología, fundamentos tecnológicos, físicos y
matemáticos de la representación gráfica en el computador.
Objetivos
Comprender y emplear los diferentes conceptos relacionados con la
representación de gráficos en el computador y los componentes de hardware
y software necesarios partiendo de los fundamentos teóricos y tecnológicos
de esta disciplina.
Identificar el establecimiento de un sistema de coordenadas en la pantalla
del computador como base fundamental para la graficación a través del
estudio de los fundamentos matemáticos que la estructuran.
– UNAD
Competencias
El estudiante describe y caracteriza de manera adecuada los conceptos y
elementos tecnológicos relacionados con la presentación de gráficos en el
computador.
Metas
Al finalizar esta unidad didáctica el estudiante estará en capacidad de:

 Enumerar los diferentes elementos que se requieren para la realización
de gráficos en el computador.
 Definir y comparar términos relacionados comúnmente con la
computación gráfica.
Mapa Conceptual de la Unidad
Productos de Aprendizaje
Individual
 Lectura autorregulada de la Unidad Didáctica realizando fichas textuales y
mapas conceptuales para archivar en el portafolio.
 Construir un glosario con los términos desconocidos y su correspondiente
significado.
– UNAD
Pequeño Grupo Colaborativo

Documento srcinal-traducido y diapositivas que permitan presentar un artículo
consultado en internet o en la biblioteca virtual, de mínimo 3 páginas en inglés que
demuestre una aplicación o avance en torno a la computación gráfica.
Grupo de Curso
 Socialización de los productos individuales y en pequeño grupo colaborativo.
 Consolidación de conceptos, glosario técnico y mapa conceptual de la
unidad.
CAPÍTULO 1 Evolución de la computación gráfica

En este capítulo se realiza una inspección histórica de los principales antecedentes
e hitos que marcan el desarrollo de la representación computacional. Para ello se
ha utilizado especialmente una síntesis presentada por el profesor Víctor Simón
Theoktisto Costa de la Universidad de Simón Bolívar de Venezuela.
La sabiduría popular dice que la historia no se repite y que el pasado no aplica

exactamente al presente. Las recetas del pasado, si se aplican ahora resultan en
general en algo diferente. ¿Cómo entonces inferir del pasado? ¿Cómo lograr un
modelo de la evolución que pueda ayudar a saber y entender lo que está pasando
ahora en el presente y poder tomar las acciones adecuadas y necesarias?
En tecnología está siempre la tendencia de mirar el futuro, pero muchos de sus
elementos, así como la mayoría de las cosas, tienen sus fundamentos y su
significado en el pasado que siguen actuando en el presente.
Lección 1 Anticipando la tecnología

Esta síntesis se plantea desde la perspectiva histórica presentada por Baecker y
Buxton en "Human-Computer Interaction" de Jenny Preece y Laurie Keller (ver en
enlaces relacionados de la unidad), para quizás entender o apreciar a donde
hemos llegado, para inspirarnos o motivarnos a dar nuevos pasos que puedan
continuar un camino ya comenzado por otros o quizás por qué no, poder aportar
nuevas luces.
Aunque nuestras computadoras digitales están sustentadas en conceptos
desarrollados en siglos pasados, no es sino hasta los años 1930’s y los 1940’s que
son realmente disponibles para los investigadores. La motivación principal era
– UNAD
acelerar los cálculos requeridos para los cómputos de la energía balística y

atómica. Quizás la primera persona que concibió la computadora más allá de este
uso fue VANNEVAR BUSH en 1945.
Vio a la computadora como una herramienta para transformar el pensamiento y la
actividad creativa del hombre. En su trabajo "As we may think", describe las
dificultades que el hombre tiene para conseguir, revisar, manejar y transmitir los
resultados de su investigación. Para resolver este problema el inventa MEMEX, un
dispositivo con aspecto de escritorio con teclado y conjunto de botones y manillas,
donde el individuo podía guardar todos sus libros, sus registros y comunicaciones
para consultarlos de manera rápida y flexible. La tecnología propuesta para este fin
fue la técnica de los microfilms. Memex fue la primera versión del computador
personal, donde Bush no sólo fue un visionario de la aplicación de la computadora
para almacenamiento y recuperación de información, y el valor del indexamiento
asociativo en esa actividad, sino también anticipó la naturaleza multimedia del uso
del computador en el futuro. El predijo el desarrollo de una máquina que escribiera
cuando se le dictara, y especuló sobre las posibilidades de establecer algún día un
camino más directo entre la palabra escrita y el cerebro. Con la emergencia de los
CD/ROM (Lambert and Ropiequet 1986) y la computación multimedia personal de
hoy se hace posible construir el MEMEX, el cual no se llegó a realizar en su
momento.
Otras personas también vieron el potencial del computador como un facilitador de
aspectos humanos como la creatividad y la resolución de problemas. Entre éstos
tenemos a J.C.R. LICKLIDER (1960), quien concibió un acoplamiento sinergético
entre las capacidades del hombre y la máquina, a lo que llamó "man-computer
symbiosis". La simbiosis se define como una forma de vida cooperativa en una
asociación íntima o unión cerrada entre dos organismos disimilares. Las
computadoras están pensadas para resolver problemas ya formulados y para
procesar datos de acuerdo a procesos predeterminados. En la realidad aparecen
giros inesperados en el razonamiento para llegar a una solución y no siempre es
fácil la formulación
entonces incorporardela problema; la simbiosis
la computadora del hombre
de manera íntimay en
la máquina pretendería
todo el proceso de
formulación y solución de problemas técnicos, logrando así integrarse
efectivamente en los procesos del pensamiento.
En un trabajo posterior con Clark en 1962, ellos listan aplicaciones en el área
militar, programación, juegos de guerra, planificación, educación, investigación
científica. Con una extraordinaria visión listan algunos problemas cuyas soluciones
son prerrequisitos para una verdadera simbiosis entre el hombre y la computadora.
– UNAD
A corto plazo:
 Las aplicaciones de tiempo compartido entre varios usuarios.

 La interfaz electrónica de entrada-salida para el despliegue y la
comunicación de la información simbólica y gráfica.
 Los sistemas interactivos y de tiempo real para el procesamiento y la
programación de la información.
 La posibilidad de concurrencia.
A largo plazo:
 La lectura óptica de caracteres.

 El reconocimiento y la producción de la voz humana.
 La comprensión del lenguaje natural.
 La programación heurística.
Lección 2 Los primeros aportes
Ya en los
gráficos años 50’s
y dibujos tan era
bienobvio
como que el computador
el texto podía
o los números manipular
(oscillon, imágenes
wirlwind, son
el juego
spacewar y sage ya se habían construido). Se comienza entonces a explorar el
potencial de la comunicación gráfica entre el hombre y la máquina. Fue IVAN
SUTHERLAND en su trabajo pionero en el MIT Lincoln Laboratory llamado el
sistema 'Sketchpad'.
Este programa permitía dibujar formas
simples en la pantalla de un computador
mediante un lápiz óptico, salvarlas y volver
a cargarlas más tarde.
Sketchpad supuso una revolución en los
programas gráficos. Muchas de las técnicas
inventadas para este programa se siguen
usando hoy en día, sin embargo lo
realmente revolucionario de sketchpad era
la estructura de datos empleada. Se trataba
Figura 1 Ivan Sutherland y el Sketchpad
de un modelo del objeto a representar y no
sólo un dibujo del mismo.
– UNAD
Algunas de las nuevas y poderosas ideas y conceptos fueron:
 Estructura jerárquica interna de los gráficos.

 La definición de objetos modelos y sus instancias que son versiones
transformadas de las primeras. Estos conceptos sirvieron de base para la
programación orientada a objetos.
 La noción de restricciones para la especificación de los detalles de la
geometría de un dibujo.
 La utilización de iconos para la representación simbólica de los objetos y
restricciones.
 El uso de los lápices de luz ("light pen") para la construcción interactiva de
los dibujos.
 La separación de los sistemas de coordenadas para describir el mundo y el
espacio de representación en el computador.
 La aplicación de operaciones recursivas como mover y borrar a toda la
jerarquía que defina un objeto o escena gráfica.
Sketchpad propició el nacimiento de la ciencia de gráficas controladas por

computadora. Dos años más tarde, Sutherland colaboraría con el doctor David
Evans para iniciar la exploración de mezclas entre arte y ciencia (computacional).
Fue la universidad de Utah la primera que tuvo un laboratorio académico específico
para desarrollar gráficas por ordenador. De la investigación realizada en la
universidad de Utah, hoy toman sus bases los paquetes gráficos, de los de diseño
hasta los de realidad virtual.
No pasó mucho tiempo sin que las compañías se empezaran a interesar por las
gráficas en computadora, IBM, por ejemplo lanzó al mercado la IBM 2250, la
primera computadora comercial con un sistema gráfico. La compañía Magnavox, a
su vez obtuvo la licencia para distribuir un sistema de videojuegos creado por
Ralph Baer, el producto fue denominado Odyssey. El Odyssey fue el primer
producto orientado al consumidor con gráficas generadas por computador.
Dave Evans fue contratado por la universidad de Utah para crear el laboratorio de
ciencias de la computación. Evans tomó como interés principal el desarrollar
gráficas por computadora. Evans contrató a Sutherland, y es en Utah donde
Sutherland perfecciona una interfaz de HMD (head mounted display), que había
desarrollado algunos años antes. En ese periodo, Evans y Sutherland eran
frecuentemente asesores de compañías, no obstante, constantemente se
encontraban frustrados por la falta de tecnología, razón que más adelante los llevó
a fundar su propia empresa.
– UNAD
Un estudiante de la clase de Sutherland en la universidad de Utah, EDWIN

CATMULL vislumbró a la animación por computadora como una evolución natural
de la animación tradicional; creó una animación, se trataba de su mano abriéndose
y cerrándose. De la universidad de Utah surgió un gran avance tecnológico en el
campo, JOHN WARNOCK fue uno de los pioneros digitales y fundó una de las
empresas más importantes que cambió el curso de la historia en cuanto a diseño
digital se refiere, fundó Adobe. Otro egresado de la universidad de Utah no es
menos notorio, Jim Clark, fundador de Silicon Graphics Inc. (SGI).
Lección 3 Teorías y planteamientos

1970 también marcó una revolución en el mercado televisivo. Cadenas como la
CBS empezaron a usar productos desarrollados para animar en la computadora. La
empresa Computer Image Corporation (CIC) desarrolló combinaciones de
Hardware y Software para acelerar procesos de animación tradicional, por medios
digitales. CIC ofrecía ANIMAC, SCANIMATE y CAESAR, con estos programas se
podían escanear los dibujos, crear trayectorias, aplicar principios de animación
tradicional tales como estiramiento y encogimiento.
En el campo de la animación 3D, se creó un nuevo tipo de representación digital, el
algoritmo de HENRI GOURAUD. Este permite que los contornos de los polígonos
no se vean tan lineales, ya que esto destruía la sensación de una superficie suave.
El algoritmo crea la interpolación de color entre polígonos y de esta forma logra una
mejor representación de superficies curvas. La ventaja sobre el método tradicional
(la representación plana) es que la superficie en efecto parece perder dureza en la
representación, con sólo una pequeña penalización en el tiempo que toma hacer la
representación.
En 1971 surge el microprocesador, utilizando tecnología de circuitos integrados, los
componentes electrónicos fueron miniaturizados. La compañía Atari fue creada y
en 1972 crea
Sutherland el se
(E&S) primer videojuego
encontraban ya de "máquina"
fabricando (arcade),propio
hardware Pong.para
Evans
evitary
algunas de las limitantes tecnológicas que algunos años antes habían
experimentado. Uno de los sistemas más impresionantes creó precisamente por
E&S era "Picture System", incluía una tableta gráfica y un buffer en color. Triple I,
en 1974 desarrolló un equipo para poder filmar las imágenes realizadas en
computadora. Otro de sus inventos fue la creación de aceleradores gráficos. Los
desarrollos de Triple I fueron un gran avance que permitía que las gráficas
sintéticas pudieran ser utilizadas en cine.
– UNAD
Ed Catmull realizó su tesis de doctorado

sobre una nueva manera de representar
las superficies. Esta nueva técnica llamada
z-buffer ayuda en el proceso de esconder
las partes de las superficies que no serán
vistas por el usuario en la representación
final. Además del z-buffer, Catmull incluyó
un nuevo concepto, el de mapeo de
texturas. La historia cuenta que en una
discusión con otro de sus compañeros, a
Catmull se le ocurrió que si a un objeto en
la vida real se le podían aplicar imágenes
para representar a otra cosa, en un mundo
Figura 2 Aplicación de texturas a objetos
virtual no había razón para no hacerlo.
El matemático francés Dr. BENOIT MANDELBROT publicó un ensayo que permitió

añadir realismo a las escenas generadas por computadora. El documento "A
Theory of Fractal
es un espacio Sets", explica
bidimensional; no que una línea
obstante, si la es un describe
línea objeto unidimesional,
una curva de el plano
manera
que cubra la superficie del plano deja de ser unidimensional, aunque tampoco es
bidimensional.
El Dr. Mandelbrot se refirió a este espacio
como una dimensión fraccionaria. Las
aplicaciones principales que se le dieron a
las teorías de Mandelbrot fueron la de
creación de terrenos aleatorios, así como la
creación de texturas en las cuales existen
subdivisiones dentro de un mismo patrón.
Después
contratadodeporsu graduación,
la empresa Catmull
Applicon, fue
donde
no duró mucho tiempo, ya que recibió una
Figura 3 Modelo de terreno usando oferta de trabajo para fundar el laboratorio
geometría fractal de animación por computadora del Instituto
Tecnológico de Nueva York (NYIT).
– UNAD
Algunos de los trabajadores de la Universidad de Utah también fueron invitados y

aceptaron el trabajo en el NYIT. Los primeros programas de animación
desarrollados dentro del NYIT fueron para apoyar la animación tradicional. La
primera aplicación que Catmull desarrollo fue "tween", que permitía realizar la
interpolación entre cuadros. También se desarrolló un sistema de escaneo y pintura
que posteriormente se convirtió en el sistema de producción de Disney, el CAPS
(Computer Animation Production System).
El NYIT creó un departamento dedicado a la investigación de gráficas 3D, y por dos
años su principal proyecto fue el de crear una película, "the works", nunca fue
concluida, de hecho, pruebas preliminares fueron bastante desalentadoras. Ante el
fracaso del corto "Tubby the tuba", varios empleados salieron del NYIT. Al parecer
el director del instituto nunca aceptó que se contrataran directores de cine para
crear la película, razón por la cual el resultado no era el mejor que se podía haber
obtenido.
En 1978 JAMES BLINN, desarrolló un
algoritmo similar al de texturado, pero en
vez de representar color representaba
profundidad.
provocan que laLos colores
superficie tengamapeados
un relieve
o una depresión. Las partes blancas de la
imagen son representadas como
protuberancias, mientras las partes
oscuras representan las depresiones. Figura 4 Aplicación de texturas y relieves
con “bump map”
Dotando de texturas y relieves se pueden crear modelos bastante realistas. El

algoritmo fue nombrado "bump map". Otro algoritmo presentado por Blinn es el de
reflectividad, con el cual se simula un reflejo del ambiente en el que se encuentra el
objeto.
De la universidad de Cornell, ROB COOK planteó un nuevo algoritmo que
erradicaba algunas de las limitantes de las representaciones anteriores. Cook
aprecio que las representaciones de la época eran de apariencia plástica. Usando
la variable de energía luminosa que emite la luz virtual logró crear un material que
se parece al de un metal pulido. Los métodos anteriores consideraban el brillo de la
luz sintética.
– UNAD
Lección 4 La revolución
Sin duda la década de cambios más vertiginosos fue la de 1980. El surgimiento de
las máquinas PC, aunque con capacidades gráficas limitadas, permitió la
popularización de sistemas y aplicaciones que crearon un mercado exigente y
competitivo (por ejemplo con el Autocad). También comenzaron a diseñarse
herramientas gráficas de interfaz hombre máquina, como por ejemplo el sistema
operativo de la Macintosh II, los lenguajes de programación visual y el hipertexto. El
rol que no alcanzaron a cumplir los Comités de estandarización (por ejemplo, el
GSK fue aprobado recién en 1985, cuando hacía varios años que ya era obsoleto)
fue cubierto por las compañías comerciales que al crear una aplicación novedosa
se transformaban en estándares de facto en el mercado (por ejemplo el Poscript, el
OpenGL y X Windows).
También esta década marcó el segundo cambio de paradigma, porque la evolución
de los modelos gráficos, junto con la capacidad de representación de los monitores
y la integración de los sistemas gráficos a otro tipo de aplicaciones (simulaciones
en ingeniería, sensores remotos, datos de satélites, etc.) permitió desarrollar
herramientas para la representación gráfica de conjuntos enormemente complejos
de datos. Estas
Científica, apelanideas, que concapacidad
a la enorme el tiempo fueron el fundamento
de comprensión visualdehumana.
la Visualización
De esa
manera es posible representar, por ejemplo, millones de datos meteorológicos en
un único gráfico que permite comprender a golpe de vista las características
esenciales de una determinada situación climática.
La popularización de la computación gráfica
significó, además, el surgimiento y
desarrollo de aplicaciones en las áreas más
diversas. Durante los ‘80 comenzaron a
utilizarse herramientas gráficas para el
diseño en Ingeniería en todas sus
actividades, desde aviones y barcos hasta
circuitos integrados. En Arquitectura e
Ingeniería Civil se utilizan sistemas para la
simulación, el diseño y la elaboración y
análisis de modelos. En Medicina podemos
mencionar desde el diagnóstico por
imágenes hasta la simulación y
Figura 5 Computación gráfica en planeamiento de operaciones quirúrgicas o
diferentes ámbitos el desarrollo de implantes.
– UNAD
En animación y videojuegos se dio un desarrollo espectacular en la calidad e

imaginación con los que surgieron universos de fantasía.
Figura 6 Largometrajes completamente desarrollados por computador
Durante los 90’s, Hollywood proporciona una gran publicidad gracias a la

producción de largometrajes totalmente computarizados, ya habían sido premiados
algunos cortos de Pixar con anterioridad. El pionero en largometrajes animados
por computador es Toy History y a partir de allí se han generado gran cantidad de
películas. El reto continúa, por hacer creíbles para los humanos, los gráficos
creados por computador.
Lección 5 Cronología en el desarrollo de la computación gráfica

A continuación se presenta una cronología de los principales hitos en el desarrollo
de la computación gráfica tomada y traducida libremente de www.comphist.org.

En los años 50: Salida usando teletipos, impresoras, y tubos de rayos catódicos
(CRT). Usando caracteres blanco y negro, se podía reproducir un cuadro.
 1950
o Ben Laposky creó las primeras imágenes gráficas, un osciloscopio,
generado por una máquina electrónica (análoga). La imagen fue
producida manipulando vigas electrónicas y registrándolas sobre una
película alta de la velocidad.
– UNAD
 1951
o UNIVAC-I: la primera computadora comercial de propósito general,
usaba dispositivos en copia dura e impresoras de línea.
o MIT – WirldWind: la primera computadora que permitía mostrar vídeo
en tiempo real, era capaz de exhibir texto y eráfico en tiempo real en
una pantalla grande de osciloscopio.
En los años 60: El comienzo de los gráficos interactivos modernos, salida son
gráficos vectoriales y gráficos interactivos. Uno de los grandes problemas era el
costo y la inaccesibilidad de las máquinas.
 1960
o Guillermo Fetter acuña el término computación gráfica para describir
nuevos métodos de diseño
 1961
o Steve Russel, primer juego de video Spacewars
 1963
o Douglas Englebart - primer ratón
o Ivan Sutherland - Sketchpad. Sistema interactivo de CG, un sistema
gráfico de comunicación humano-computadora.
 Menús pop-up
 Modelamiento jerárquico
 Utilizó un lápiz de luz para la interacción.
o Sutherland formuló las ideas de usar primitivas para el dibujo de
líneas, polígonos, arcos, etc.; desarrolló los algoritmos de dragging,
rubberbanding y transformación; introdujo las estructuras de datos
para almacenar. Es considerado el fundador de los gráficos por
computadora.
 1964
o Guillermo Fetter - Primer modelo por computador de una figura
humana
 1965
o Jack Bresenham - Algoritmo para el dibujo de líneas
 1968
o Tektronix - Un computador basado en tubos de rayos catódicos, que
permitía el almacenamiento, el teclado y el ratón, un computador con
una interfaz simple de US$15.000, que permitía el uso de gráficos.
o Ivan Sutherland – Primer display head-mounted
– UNAD
 1969
o Jhon Warnock - Algoritmo de la subdivisión de área, algoritmos de
superficies ocultas.
o Laboratorios Bell – Primer frambuffer que contiene 3 bits por pixel.
Al inicio dedelos
capacidad los años 70:esComienzo
gráficos de la salida usando dispositivos ráster, la
cada vez mayor.
 1972
o Nolan Kay Bushnell - Pong, juego de video
 1973
o Juan Whitney Jr. y Gary Demos - "Westworld", primera película con
gráficos de computador
 1974
o Edwin Catmuff - mapeo de texturas y algoritmo z-buffer para
superficies ocultas.
o James Blinn - superficies curvas y refinamiento del algoritmo de
mapeo de texturas.
o Phone Bui-Toung - iluminación especular
 1975
o Martin Newell - la famosa tetera que identifica la computación gráfica,
construida con curvas de Bezier.
o Benoit Mandelbrot - dimensión fractal/fraccional
 1976
o James Blinn - método para simular reflexiones especulares sobre
objetos
 1977
o Steve Wozniak - Apple II, computador personal con gráficos a color
 1979
o
Roy Trubshaw
Phone y -Richard
Bui-Toung specularBartle - Dominios multi-usuario (MUD -
highlighting)
En los años 80 los dispositivos de salida incorporan los gráficos de ráster imágenes
de mapas de bit (bitmap) y el pixel. Los costos de los computadores personales
decrecen dramáticamente, el ratón y el trackball se convierten en los dispositivos
interactivos estándares.
– UNAD
 1982
o Steven Lisberger - "Tron", la primera película de Disney que hace
uso intensivo de los gráficos tridimensionales
o Tom Brighman - "Morphing" primera secuencia de película juega con
un carácter femenino que deforma y se transforma a sí misma en la
forma de un lince
o Jhon Walkner y Dan Drake – AutoCAD
 1983
o Jaron Lanier - "DataGlove", una película de realidad virtual que usa
un guante instalado con interruptores y sensores para detectar el
movimiento de la mano.
 1984
o Tech de Wavefron - Polhemus, primer software paras gráficos en 3D
 1985
o Pixar Animation Studios. Cortometrajes “Luxo Jr.”- 1989 y “Tin toy”
o NES – Sistema de juegos casero Nintendo
 1987
o IBM - VGA (Video Graphics Array) Se introdujo el arreglo de gráficos
 1989 de video.
o Video Electronics Standards Association (VESA) – SVGA, Super VGA
En los años 90, desde la introducción del VGA y el SVGA, el computador personal
puede mostrar fácilmente imágenes fotorealistas y películas. La optimización de las
imágenes en 3D comienza su principal avance estimuladas por las aplicaciones
para gráficos usadas en el cine.
 1990
o Hanrahan and Lawson - Renderman

1991
o Disney y Pixar - “Beauty and the Beast”, CGI fue ampliamente
utilizada, el sistema Renderman proporciona rapidez, precisión y alta
calidad a los efectos por computador.
 1992
o Silicon Graphics - Especificación OpenGL
 1993
o Universidad de Illinois - Mosaic. Primer navegador web gráfico.
o Steven Spielberg - “Jurassic Park” una exitosa película de ciencia
ficción a partir de efectos de computación gráfica.
– UNAD
 1995
o Buena Vista Pictures - “Toy Stroy” el primer largometraje
completamente generado en computador
o NVIDIA Corporation - GeForce 256 (GeForce3 (2001)
 2003
o ID Software - Motor de gráficos Doom.
CAPÍTULO 2 Fundamentos de computación gráfica

Los procesos de manipulación de gráficos requieren de una tecnología sofisticada
en temas como intercambios de formatos, escalado, filtrado, manejo del color
mediante paletas, etc. Los formatos mas utilizados son BMP (Bitmap), GIF (Graphic
Interchange Format) y JPEG (Joint Picture Expert Group).
Cuanto mayor y más nítida sea una imagen y cuantos más colores tenga, más
difícil es de presentar y manipular en la pantalla de un computador. Las fotografías,
dibujos y otras imágenes estáticas deben pasarse a un formato que el computador
pueda manipular y presentar. Entre esos formatos están los gráficos de mapas de
bits (o de píxeles), conocido en el ámbito de la computación gráfica como ráster y
los gráficos vectoriales.
Lección 6 Tipos de graficación computacional

6.1 Gráficos ráster
Las imágenes de mapa de bits (bitmaps o imágenes ráster) están formadas por una
rejilla de celdas, a cada una de las cuales, denominada píxel (Picture Element,
Elemento de Imagen), se le asigna un valor de color y luminancia propios, de tal
forma que su agrupación crea la ilusión de una imagen de tono continuo.
Figura 7 Mapa de bits

– UNAD
Un píxel es pues una unidad de información, pero no una unidad de medida, ya

que no se corresponde con un tamaño concreto. Un píxel puede ser muy pequeño
(0.1 milímetros) o muy grande (1 metro).
Una imagen de mapa de bits se crea mediante una rejilla de pixeles única. Cuando
se modifica su tamaño, se modifican grupos de pixeles, no los objetos o figuras que
contiene, por lo que estos suelen deformarse o perder alguno de los pixeles que los
definen. Por lo tanto, una imagen de mapa de bits está diseñada para un tamaño
determinado, perdiendo calidad si se modifican sus dimensiones, dependiendo esta
pérdida de la resolución a la que se ha definido la imagen.
Figura 8 Dos rejillas de 3*3 píxeles
La resolución de una imagen es un concepto que suele confundir bastante,

principalmente porque no es un concepto único, sino que depende del medio en el
que la imagen vaya a ser visualizada o tratada. Así, podemos hablar de resolución
de un archivo digital, resolución de impresión, resolución de semitono, resolución
de escaneado, etc. Se define como el número de píxeles distintos que tiene una
imagen por unidad de longitud, es decir, la densidad de éstos en la imagen. Sus
unidades de medida son los pixeles por pulgada (ppp o ppi, pixels per inch, en
inglés) o los pixeles por centímetro (más raramente). Cuanto mayor sea esta
resolución, más contenedores de información (pixeles) tiene el archivo digital, más
calidad tendrá la imagen y más peso en Kb tendrá el archivo.
Esta resolución está muy ligada al concepto de resolución de pantalla en un
monitor, referida al número de píxeles por pulgada existentes en la pantalla del
monitor en el que se visualiza la imagen. Una configuración del monitor en alta
resolución exhibirá más píxeles por pulgada, por lo que éstos serán más pequeños,
permitiendo una mejor visualización de la imagen en pantalla. En ningún caso
podremos visualizar una imagen a mayor resolución que la de pantalla, que suele
ser de 72 ppp en un sistema Mac y de 96 ppp en un PC.
Una vez definida la resolución de pantalla, el tamaño de los pixeles dependerá del
tamaño físico de la pantalla, medido en pulgadas. En la próxima sección se
profundizará sobre este punto.
En el trabajo de digitalización de imágenes con escáner se maneja el concepto de
resolución de muestreo, que define el número de muestras que se toman por
– UNAD
pulgada. Su unidad de medida son las muestras por pulgada (spi, samples per
inch). Cuantas más muestras por pulgada tenga una imagen escaneada, más
cercana estará la imagen digital a la imagen srcinal. Esta forma de medir la
resolución se utiliza poco, habiéndose adoptado como medida de calidad de una
imagen escaneada los píxeles por pulgada (ppp) que tiene la imagen digital
resultante del proceso.
Una forma común de clasificar las imágenes según su resolución es aquella que las
divide en imágenes de alta resolución (hi-res) e imágenes de baja resolución (low-
res). Una imagen de alta resolución está prevista para la impresión, teniendo
generalmente 300 ppp o más. Una imagen de baja resolución está prevista
solamente para su exhibición en pantalla, teniendo generalmente una resolución de
100 ppp o menos.
Figura 9 Modificación en la resolución
A mayor resolución, más píxeles hay en una imagen, más grande es su mapa de
bits, mayor información contiene y mayor capacidad de distinguir los detalles
espaciales finos, por lo que tendrá más definición, permitiendo un mayor detalle,
unas transiciones de color más sutiles y una mayor calidad de reproducción.
Las imágenes de mapas de bits dependen de la resolución a la que han sido
creadas, por lo que al modificar su tamaño pierden calidad visual. Si se disminuye,
los trazos finos perderán definición, desapareciendo partes de los mismos,
mientras que si se aumenta, la imagen se pixelará, al tener que cubrirse de forma
aproximada pixeles que inicialmente no existían, produciéndose el conocido efecto
de dientes de sierra.
– UNAD
Figura 10 Efecto de pixelado en mapas de bits
El principal inconveniente con los gráficos de mapas de pixeles durante el

almacenamiento a su transmisión a través de una línea de comunicación de datos,
es el elevado tamaño de los archivos que generan. Se hace por tanto necesaria la
compresión de estos archivos.
La compresión, tanto de archivos de imágenes como de cualquier otro tipo de
archivo informático, puede ser de dos tipos, compresión con pérdidas y compresión
sin pérdidas. En la compresión con pérdidas se elimina información de la imagen
que no es percibida por el ojo. Una vez se ha comprimido una imagen no se puede
volver a restaurar con la calidad de la srcinal, la información irrelevante es
eliminada en el proceso de compresión.
Utilizar las tres dimensiones espaciales en los gráficos complica tremendamente la
generación de imágenes. No es únicamente utilizar una tercera coordenada en la
descripción de los objetos, existen, además nuevos problemas a tener en cuenta
como la iluminación, la ocultación de unos objetos por otros, el uso de textura y
una profundidad, además de tecnologías utilizadas para dotar de realismo a las
imágenes generadas por computador.
6.2 Gráfico vectorial

Un gráfico vectorial está definido por un conjunto de primitivas geométricas de tal
modo que, al dibujarlas, se compone la imagen final.
Por lo tanto, las imágenes en los gráficos vectoriales no se construyen píxel a píxel,
sino que se forman a partir de vectores, objetos formados por una serie de puntos
y líneas rectas o curvas definidas matemáticamente.
Por ejemplo, una línea se define en un gráfico de mapa de bits mediante las
propiedades de cada uno de los píxeles que la forman, mientras que en un gráfico
vectorial se hace por la posición de sus puntos inicial y final y por una función que
– UNAD
describe el camino entre ellos. Análogamente, un círculo se define vectorialmente

por la posición de su punto central (coordenadas x,y) y por su radio (r).
Cada vector en un gráfico vectorial tiene una línea de contorno, con un color y un
grosor determinados, y está relleno de un color a elegir. Las características de
contorno (o filete) y relleno se pueden cambiar en cualquier momento.
Las imágenescomponentes,
sus vectores vectoriales sesualmacenan
posición y como una lista que describe cada uno de
sus propiedades.
En cuanto a la resolución, los gráficos vectoriales son independientes de la
resolución, ya que no dependen de una retícula de píxeles dada. Por lo tanto,
tienen la máxima resolución que permite el formato en que se almacena, no se
presentan inconvenientes con el efecto de pixelado ya que la descripción
matemática de un objeto es independiente del tamaño al cual se esté dibujando el
objeto.
Las entidades geométricas que forman parte de un gráfico vectorial son: el
segmento de recta, las circunferencias, las elipses, y los arcos de circunferencia.
Las trasformaciones típicas sobre las imágenes vectoriales son la traslación, la
rotación, el escalado y la cizalla. Estas transformaciones, puramente geométricas,
se muestran en la siguiente figura. Después de aplicarlas el objeto gráfico
conserva su precisión.
Figura 11 Transformaciones en gráficos vectoriales
Lección 7 Sistema de coordenadas

Según Delrieux, el primer paso para conseguir una representación adecuada de las
primitivas es caracterizar matemáticamente el medio que nos permite
representarlas. Las primitivas gráficas independientes de dispositivo (en la
“imagen” mental del usuario) normalmente se representan en un espacio euclidiano
de una determinada dimensión. En dichas condiciones un punto es una entidad
matemática p = (x; y), donde (x;y)  R2.
– UNAD
En el soporte aritmético de la computadora, dicha representación se efectúa con

los tipos de datos provistos, que pueden ser números reales con punto flotante de
simple o doble precisión. Este espacio se denomina espacio de la escena y es uno
de los muchos espacios que se utilizarán para factorizar adecuadamente las
diversas tareas de un sistema gráfico.
Por último, en el soporte gráfico del buffer de pantalla, un punto se representa con
un pixel, y dicha representación se efectúa accesando una posición de memoria
con un contenido dado. Este espacio se denomina espacio de pantalla y se
direcciona a partir del sistema de coordenadas físico, cuyo srcen es el vértice
superior izquierdo. Es posible encontrar varias correspondencias posibles entre el
sistema de coordenadas físico y un sistema de coordenadas arbitrario en el
espacio de la escena. En la literatura normalmente se considera que un pixel es un
“punto con extensión" en el espacio de la escena, y por lo tanto el srcen de dicho
espacio coincide con el vértice superior izquierdo del pixel (0,0). Como se muestra
en la siguiente figura. Una precisión mayor llevaría a enunciar que se encuentra en
el centro del pixel (0.0).
Figura 12 Sistema de coordenadas en el espacio de la escena
De esa manera,
[0..maxy], el espacio
con maxx, maxy de pantalla es un espacio discreto y acotado [0..maxx] *
 N, el cual está en correspondencia con el espacio de
la escena (euclidiano) (x; y)  R2 . La conversión de los valores reales del espacio

euclidiano e enteros para la representación en el espacio de pantalla se puede
realizar a partir de las operaciones de redondeo o truncamiento. Por ejemplo, en
el caso de C++ se puede realizar a través de un proceso de casting a datos enteros
cortos o largos, o a través de las funciones ceil y floor de la librería math.h. Por
dicha razón es que la operación de llevar una primitiva del espacio de la escena al
espacio de pantalla se denomina discretización. Como se puede observar en la
Figura 12 los rótulos maxx y maxy corresponden al valor máximo del rango que
– UNAD
pueden tomar los puntos x,y en el espacio de pantalla, estos valores dependen de
la resolución del monitor.
La transformación de sistemas de coordenadas que es posible realizar en los
procesos de graficación en 2D y 3D se explicarán en las unidades didácticas
correspondientes.
Lección 8 Introducción a la teoría del color

Alrededor del color se han realizado numerosas investigaciones, en esta sección se
proporcionan lo principios fundamentales de esta teoría en un lenguaje lo más claro
posible, utilizando para ello la conceptualización presentada por el Instituto de Artes
Visuales, la Web del programador, Rafael Cebrián y Claudio Delrieux.
Los colores forman parte de la vida misma, y el ser humano es uno de los seres
privilegiados de la Naturaleza por poder disfrutar de ellos. En cualquier momento
de la vida se están recibiendo constantemente impresiones de color, en la calle,
trabajando, navegando por internet, estas impresiones tiene la facultad de exaltar,
tranquilizar, de poner de buen humor o de inspirar pena. Es el mundo de color.
Newton (1642-1727) primero y Young (1773-1829) después establecieron un
principio que hoy nadie discute: la luz es color. Para llegar a este convencimiento,
Isaac Newton se encerró en una habitación a oscuras, dejando pasar un hilillo de
luz por la ventana y poniendo un cristal – un prisma de base triangular – frente a
ese rayo de luz; el resultado fue que dicho cristal descompuso la luz exterior blanca
en los seis colores del espectro, los cuales se hicieron visibles al incidir sobre una
pared cercana.
Figura 13 Espectro con los 6 colores apreciados por Newton (violeta, azul, verde, amarillo, naranja y rojo)
Unos años más tarde, el físico inglés Thomas Young realizó el experimento a la
inversa. En primer lugar determinó por investigación que los seis colores del
espectro pueden quedar reducidos a tres colores básicos: el verde, el rojo y el azul
intenso. Tomó entonces tres linternas y proyectó tres haces de luz a través de
filtros de los colores mencionados, haciéndolos coincidir en un mismo espacio; los
haces verde, rojo y azul se convirtieron en luz blanca. En otras palabras, Young
recompuso la luz.
– UNAD
Así, la luz blanca, esa luz que rodea al ser humano, está formada por luz de seis
colores; y cuando incide en algún cuerpo éste absorbe alguno de dichos colores y
refleja otros. Esto da lugar al siguiente principio: Todos los cuerpos opacos, al ser
iluminados, reflejan todos o parte de los componentes de la luz que reciben.
En la práctica, y para comprender mejor este fenómeno, se dirá que, por ejemplo,
un tomate rojo absorbe el verde y el azul y refleja el rojo; y un plátano amarillo
absorbe el color azul y refleja los colores rojo y verde, los cuales, sumados,
permiten ver el color amarillo.
El color es una sensación subjetiva y nadie puede asegurar a ciencia cierta que
percibe los colores igual que otro. De todas formas los hombres vemos más o
menos igual y partiendo de esta premisa se deberá estudiar la teoría del color.
Aprender a ver el color y obtener una interpretación de sus propiedades inherentes
ha de ser el punto de partida si se desea realizar un tratamiento eficaz de éste en
las distintas aplicaciones gráficas que se construyen.
8.1 Descripción formal del color como fenómeno físico

Podemos ver las cosas que nos rodean porque La Tierra recibe la luz del Sol, esta
estrella inunda constantemente el planeta con su luz, y gracias a ella es también
posible la vida.
La luz del Sol está formada en realidad por un amplio espectro de radiaciones
electromagnéticas de diferentes longitudes de onda, formando un espectro
continuo de radiaciones, que comprende desde longitudes de onda muy pequeñas,
de menos de 1 picómetro (rayos cósmicos), hasta longitudes de onda muy grandes,
de más de 1 kilómetro.
El ser humano tan solo es capaz de visualizar un subconjunto de ellas, las que van
desde 380 (violeta) a 780 nanómetros (rojo), esto lo apreció Newton en su
experimento.
– UNAD
Figura 14 Espectro de la luz solar
Cada longitud de onda define un color diferente (colores de emisión). La suma de

todos los colores (longitudes de onda) da como resultado la luz blanca, siendo el
color negro u oscuridad la ausencia de colores.
En el fondo del ojo existen millones de células especializadas en detectar las
longitudes de onda procedentes del entorno. Estas células, principalmente los
conos y los bastoncillos, recogen las diferentes partes del espectro de luz solar y
las transforman en impulsos eléctricos, que son enviados luego al cerebro a través
de los nervios ópticos, siendo éste el encargado de crear la sensación del color.
Figura 15 Fisiología del ojo humano

– UNAD
Los conos se concentran en una región cerca del centro de la retina llamada fóvea.
Su distribución sigue un ángulo de alrededor de 2° contados desde la fóvea. La
cantidad de conos es de 6 millones y algunos de ellos tienen una terminación
nerviosa que va al cerebro.
Los conos son los responsables de la visión del color y se cree que hay tres tipos
de conos, sensibles a los colores rojo, verde y azul, respectivamente. Dada su
forma de conexión a las terminaciones nerviosas que se dirigen al cerebro, son los
responsables de la definición espacial. También son poco sensibles a la intensidad
de la luz y proporcionan visión fotópica (visión a altos niveles).
Los bastones se concentran en zonas alejadas de la fóvea y son los responsables
de la visión escotópica (visión a bajos niveles). Los bastones comparten las
terminaciones nerviosas que se dirigen al cerebro, siendo por tanto su aportación a
la definición espacial poco importante. La cantidad de bastones se sitúa alrededor
de 100 millones y no son sensibles al color. Los bastones son mucho más
sensibles que los conos a la intensidad luminosa, por lo que aportan a la visión del
color aspectos como el brillo y el tono, y son los responsables de la visión nocturna.
Existen grupos de conos especializados en detectar y procesar un color
determinado, siendo diferente el total de ellos dedicados a un color y a otro. Por
ejemplo, existen más células especializadas en trabajar con las longitudes de onda
correspondientes al rojo que a ningún otro color, por lo que cuando el entorno en
que nos encontramos nos envía demasiado rojo se produce una saturación de
información en el cerebro de este color, srcinando una sensación de irritación en
las personas.
Cuando el sistema de conos y bastoncillos de una persona no es el correcto se
pueden producir una serie de irregularidades en la apreciación del color, al igual
que cuando las partes del cerebro encargadas de procesar estos datos están
dañadas. Esta es la explicación de fenómenos como la Daltonismo. Una persona
daltónica no aprecia las gamas de colores en su justa medida, confundiendo los
rojos con los verdes.
Debido a que el proceso de identificación de colores depende del cerebro y del
sistema ocular de cada persona en concreto, es posible medir con toda exactitud la
longitud de onda de un color determinado, pero el concepto del color producido por
ella es totalmente subjetivo, dependiendo de la persona en sí. Dos personas
diferentes pueden interpretar un color dado de forma diferente, y puede haber
tantas interpretaciones de un color como personas hay.
– UNAD
En realidad el mecanismo de mezcla y producción de colores generados por la

reflexión de la luz sobre un cuerpo es diferente al de la obtención de colores por
mezcla directa de rayos de luz, como ocurre con el del monitor de un ordenador,
pero a grandes rasgos y a nivel práctico son suficientes los conceptos estudiados
hasta ahora.
Lección 9 Modelos de color

Los colores obtenidos directa y naturalmente por descomposición de la luz solar o
artificialmente mediante focos emisores de luz de una longitud de onda
determinada se denominan colores aditivos.
No es necesaria la unión de todas las longitudes del espectro visible para obtener
el blanco, ya que si se mezcla sólo rojo, verde y azul se obtiene el mismo resultado.
Es por esto por lo que estos colores son denominados colores primarios, porque la
suma de los tres produce el blanco. Además, todos los colores del espectro pueden
ser obtenidos a partir de ellos.
Figura 16 Colores primarios
Los colores aditivos son los usados en trabajo gráfico con monitores de ordenador,
ya que el monitor produce los puntos de luz partiendo de tres tubos de rayos
catódicos, uno rojo, otro verde y otro azul. Por este motivo, el modelo de definición
de colores usado en trabajos digitales es el modelo RGB (Red, Green, Blue).
Todos los colores que se visualizan en el monitor están en función de las
cantidades de rojo, verde y azul utilizadas. Por ello, para representar un color en el
sistema RGB se le asigna un valor entre 0 y 255 (notación decimal) o entre 00 y FF
(notación hexadecimal) para cada uno de los componentes rojo, verde y azul que lo
– UNAD
forman. Los valores más altos de RGB corresponden a una cantidad mayor de luz
blanca. Por consiguiente, cuanto más altos son los valores RGB, más claros
son los colores.
De esta forma, un color cualquiera vendrá representado en el sistema RGB
mediante la sintaxis decimal (R,G,B) o mediante la sintaxis hexadecimal
#RRGGBB. El color rojo puro, por ejemplo, se especificará como (255,0,0) en
notación RGB decimal y #FF0000 en notación RGB hexadecimal, mientras que el
color rosa claro dado en notación decimal por (252,165,253) se corresponde con el
color hexadecimal #FCA5FD.
Figura 17 Notación RGB de colores
Esta forma aditiva de percibir el color no es única. Cuando la luz solar choca contra
la superficie de un objeto, éste absorbe diferentes longitudes de onda de su
espectro total, mientras que refleja otras. Estas longitudes de onda reflejadas son
precisamente las causantes de los colores de los objetos, colores que por ser
producidos por filtrado de longitudes de onda se denominan colores sustractivos.
Este fenómeno es el que se produce en pintura, donde el color final de una zona va
a depender de las longitudes de onda de la luz incidente reflejadas por los
pigmentos de color de la misma.
Un coche es de color azul porque absorbe todas las longitudes de onda que forman
la luz solar, excepto la correspondiente al color azul, que refleja, mientras que un
objeto es blanco porque refleja todo el espectro de ondas que forman la luz, es
decir, refleja todos los colores, y el resultado de la mezcla de todos ellos da como
resultado el blanco. Por su parte, un objeto es negro porque absorbe todas las
longitudes de onda del espectro: el negro es la ausencia de luz y de color.
– UNAD
En esta concepción sustractiva, los colores primarios son otros, concretamente el

cian, el magenta y el amarillo . A partir de estos tres colores es posible obtener
casi todos los demás, excepto el blanco y el negro.
Efectivamente, la mezcla de pigmentos cian, magenta y amarillo no produce el
color blanco, sino un color gris sucio, neutro. En cuanto al negro, tampoco es
posible obtenerlo a partir de los primarios, siendo necesario incluirlo en el conjunto
de colores básicos sustractivos, obteniéndose el modelo CMYK (Cyan, Magenta,
Yellow, Black).
El sistema CMYK, define los colores de forma similar a como funciona una
impresora de inyección de tinta o una imprenta comercial de cuatricromía. El color
resulta de la superposición o de colocar juntas gotas de tinta semitransparente, de
los colores cian (un azul brillante), magenta (un color rosa intenso), amarillo y
negro, y su notación se corresponde con el valor en tanto por ciento de cada uno
de estos colores.
De esta forma, un color cualquiera vendrá expresado en el sistema CMYK
mediante la expresión (C,M,Y,K), en la que figuran los tantos por ciento que el color
posee de los componentes básicos del sistema. Por ejemplo, (0,0,0,0) es blanco
puro (el blanco del papel), mientras que (100,0,100,0) corresponde al color verde.
Figura 18 Notación CMYK de un color
Los colores sustractivos son usados en pintura, imprenta y, en general, en todas

aquellas composiciones en las que los colores se obtienen mediante la reflexión de
la luz solar en mezclas de pigmentos (tintas, óleos, acuarelas, etc.). En estas
composiciones se obtiene el color blanco mediante el uso de pigmentos de ese
color (pintura) o usando un soporte de color blanco y dejando sin pintar las zonas
de la composición que deban ser blancas (imprenta).
– UNAD
Los sistemas RGB y CMYK se encuentran relacionados, ya que los colores

primarios de uno son los secundarios del otro (los colores secundarios son los
obtenidos por mezcla directa de los primarios).
Otro modelo de definición del color es el modelo HSV o HSB, que define los
colores en función de los valores de tres importantes atributos de estos, matiz
(Hue), saturación (Saturation) y brillo (Value) .
Figura 19 Modelo de color HSV
El matiz del color (Hue), también conocido como tono es el color en sí mismo,
supone su cualidad cromática, es -simplemente- un sinónimo de color. Es la
cualidad que define la mezcla de un color con blanco y negro. Está relacionado con
la longitud de onda de su radiación. Según su tonalidad se puede decir que un
color es rojo, amarillo, verde.
La saturación está relacionada con la pureza cromática o falta de dilución con el
blanco. Constituye la pureza del color respecto al gris, y depende de la cantidad de
blanco presente. Cuanto más saturado está un color, más puro es y menos mezcla
de gris posee.
Figura 20 Saturación
– UNAD
El brillo (Value) o brillantez tiene que ver con la intensidad o el nivel de energía. Es
la luminosidad de un color (la capacidad de reflejar el blanco. Alude a la claridad u
oscuridad de un tono. Es una condición variable, que puede alterar
fundamentalmente la apariencia de un color. La luminosidad puede variar
añadiendo negro o blanco a un tono.
Lección 10 Representación del color en computación gráfica

El color en las tarjetas gráficas, como vimos, se representa por medio del espacio
cromático RGB. Esto significa que el color de cada pixel se representa por medio
de una terna de valores de las componentes en rojo, verde y azul, respectivamente,
que tiene dicho color. Si cada pixel tiene asignada memoria para sus componentes
RGB, se trata del modo true color. En cambio, si el pixel guarda un índice a una
entrada en una tabla de colores donde está definido el color del cual está pintado el
pixel, estamos en modos gráficos más económicos.
En dichos modos, el acceso del índice del color de un pixel se efectúa según la
aplicación utilizada para diseñar el gráfico. Por ejemplo, en C gráfico esta
asignación se realiza por medio de la sentencia putpixel(x,y,c), mientras que
asignar una entrada en la tabla de colores se realiza por medio de la sentencia
setrgbpalette(c,r,g,b). En dicho modelo se utiliza la sentencia putpixel(x,y,c) para
acceder al buffer de pantalla y dibujar un pixel en la posición x, y con el índice de
color c, con x, y, c de tipo entero. En Java la instrucción Color micolor = new
Color(r,g,b) define una objeto de la clase Color cuya coloración estará definida por
los valores de sus parámetros enteros r, g, b. A su vez, para dibujar un pixel en el
dispositivo gráfico actual no se define un método, pero es posible realizarlo a partir
del método drawRect(x,y, 0, 0) de la clase Graphics. Este método dibuja un
rectángulo con 0 pixeles de ancho y 0 pixeles de alto en la coordenada precisada
por x, y (que son enteros), el resultado final de este método es el dibujo de un pixel
en la ventana de gráficos.
En los modos gráficos VGA y super VGA, los parámetros r, g, b son de tipo
unsigned int, pero se truncan los dos bit menos significativos, dado que el rango
efectivo de cada componente es de 0 a 63. Por lo tanto es conveniente utilizar una
aritmética dentro de dicho rango para representar los colores, y multiplicar por 4 en
el momento de la llamada.
Los modos gráficos VGA y SVGA permiten definir en general 256 colores
simultáneos (“paleta” gráfica) de entre 256K colores posibles. Estas posibilidades
pueden ser, en algunos casos, poco satisfactorias, no sóolo porque la paleta sea
– UNAD
limitada, sino porque los colores son definibles con poca precisión en algunos
casos. Si bien el ojo humano detecta aproximadamente 350.000 colores diferentes
(y es capaz de distinguir aproximadamente 50.000 en forma simultánea), esta
sensibilidad no es uniforme en todo el espacio cromático, sino que es mucho mayor
en ciertas áreas (por ejemplo en el eje naranja-violeta) y mucho menor en otras
(por ejemplo en el eje magenta-verde).
De los 256K colores definibles, miles de ellos son idénticamente percibidos,

mientras que otros no se representan con una fidelidad adecuada. En otras
palabras, el espacio RGB es una forma muy ineficiente de representar colores
porque la información está codificada de una manera muy “incoherente” con
respecto a la capacidad del ojo.
En los modos gráficos true color el problema se soluciona con un costo muy grande
(3 bytes por pixel es mucho más de lo necesario). Sin embargo, hay personas con
visión cromática muy sensible que siguen encontrando diferencias de matiz entre
colores contiguos en la gama del amarillo-anaranjado y del violáceo.
Probablemente la mejor solución hubiera sido contar con tecnología CSV en las
tarjetas gráficas, dado que la conversión al RGB del monitor se puede hacer dentro
de la controladora de video.
10.1 Paletas Estáticas y Dinámicas

En muchas circunstancias la capacidad de manejo de colores en las tarjetas gráfica
está restringida a una paleta de 256 colores simultáneos. Esto puede deberse a
varios factores. Por ejemplo, puede ser necesaria la mayor resolución posible, y sin
una cantidad de memoria adecuada para el frame buffer puede no ser suficiente
para soportar el modelo true color. Puede ocurrir también por limitaciones
tecnológicas (tarjetas o monitores obsoletos, falta de drivers, etc.). La limitación en
la cantidad de colores simultáneos se sobrelleva, en general, con un esquema
cromático que utiliza una paleta con los 256 colores más significativos de la
imagen. Estos 256 colores son obtenidos durante la generación de la misma
(generalmente con histogramas y técnicas de separación), por lo que las paletas se
denominan dinámicas.
Sin embargo, en un sistema gráfico de propósito general el esquema dinámico de
paletas puede ser inadecuado cuando se desea manejar dos o más imágenes
desarrolladas independientemente, porque cada una de ellas reclamará lo que
considera que son los colores más adecuados. El sistema tiene que llegar a una
solución de compromiso, sacrificando algunos de los colores de cada una de las
– UNAD
imágenes. Esto produce como resultado un deterioro impredecible en la calidad

gráfica. Al mismo tiempo, una paleta dinámica resulta inaceptable en aplicaciones
interactivas, porque al modificar cualquier propiedad de la escena (el agregado de
un nuevo objeto, los atributos de un objeto ya dibujado, las condiciones de
iluminación, etc.) se requiere el recalculo de los histogramas de la escena
completa, y el redibujado completo de la misma, lo cual insume un tiempo muy
grande.
En las paletas estáticas, por su parte existe un esquema cromático predefinido. Es
decir, se define de antemano un conjunto de colores adecuados para graficar
cualquier escena, en cualquier condición de iluminación y bajo cualquier algoritmo.
Los resultados gráficos tienden a ser de menor calidad. Sin embargo, la calidad de
las imágenes, una vez graficadas, no se deteriora con el posterior agregado de
otras imágenes. Al mismo tiempo, la referencia al índice de color que corresponde
a cada pixel puede calcularse a partir del color que debería corresponder al mismo.
De esa forma, la imagen es graficada al mismo tiempo que es computada, sin un
costo adicional debido al manejo de color.
Un esquema estático de color ubica el índice de color con el que corresponde
colorear un pixel
colores más en función
cercanos del color en
disponibles reclamado por el
la paleta, modelo de iluminación,
probablemente por medioy los
de
interpolación. En capítulos posteriores estudiaremos como funcionan los modelos
de iluminación. Supongamos ahora que para un punto p de cada cara en la escena
se computan ecuaciones que determinan la componente del color para cada
primario RGB.
Cada pixel de cada cara reclamará un color determinado, es decir, una terna de
reales (R(p), G(p), B(p)). Esta terna debe transformarse a una terna (R,G,B) dentro
de la aritmética de la tarjeta gráfica. Al mismo tiempo, los valores de (R,G,B) deben
estar asociados a uno de los índices de color disponibles.
Una forma de diseñar paletas estáticas proviene de las siguientes consideraciones.
Normalmente
precisión de 6lasbittarjetas
en unarepresentan la intensidad
escala entera de 0 a de
63, cada primario
lo cual con256K
permite una
combinaciones de colores. De dichos 256K colores, es necesario elegir los 256
más representativos para un uso general. Más aún, deben ser elegidos de manera
tal que cualquier aplicación gráfica que reclama un color no existente en la paleta,
pueda encontrar rápidamente el índice de un color perteneciente a la paleta que
sea el más adecuado para remplazarlo. Es necesario, entonces, elegir un
subconjunto de las 64 intensidades permitidas para cada primario, de modo tal que
el producto de la cantidad de elementos en cada conjunto sea menor o igual que
256. En los modos gráficos de 64K colores (conocidos como hi-color), se utiliza una
– UNAD
partición en 32 * 64 * 32, asignándole mayor resolución cromática al primario verde,

dada la gran sensibilidad del ojo al mismo. Pero en nuestro caso, combinaciones
como 8 * 8 * 4 quedan eliminadas, porque 4 intensidades posibles para un primario
es un valor demasiado pequeño, aún para el primario azul. La combinación que
empíricamente resultó ideal fue 6 * 7 * 6, ya que su producto es 252, es decir,
desaprovecha solamente 4 índices de color, y representa una buena solución de
compromiso.
De esa forma, se eligen 6 intensidades permitidas para los primarios rojo y azul, y 7
para el primario verde (que es para el cual el ojo humano es más sensitivo). De esa
manera, el espacio RGB de la tarjeta queda “cuantizado” en 150 prismas
rectangulares, y todos los colores representables que caen dentro de un mismo
prisma se aproximan al valor del vértice más cercano. La determinación de los
6*7*6 valores se debe realizar en forma experimental, teniendo en cuenta la
corrección del monitor utilizado. En un determinado monitor (un NEC MultiSync 3D)
para una posición adecuada en las perillas de brillo y contraste, los resultados
elegidos fueron rojo = (0,20, 32, 45, 55, 63), verde = (0, 15, 22, 30, 40, 50, 63) y
azul = (0, 25, 35, 45, 55, 63). Debemos recordar que en este modo gráfico, es
posible dar un valor entero de 0 a 63 a la intensidad en cada primario. La estructura
de la cuantización del espacio RGB elegida resulta ser muy práctica en el momento
de encontrar el color con el cual pintar un pixel. Antes de ejecutar la graficación, es
decir, como paso de inicialización de la interfaz, se almacena la paleta en la tabla
de colores de la pantalla.
La estructura de la cuantización del espacio RGB elegida resulta ser muy práctica
en el momento de encontrar el color con el cual pintar un pixel. Antes de ejecutar la
grabación, es decir, como paso de inicialización de la interfaz, se almacena la
paleta en la tabla de colores de la pantalla.
Cuando es necesario graficar un pixel de un color R,G,B arbitrario, se buscan los
valores r; g; b tales que rojo[r], verde[g], azul[b] sean los valores más cercanos, y
luego se grafica el pixel con el índice de color 42*r+6*g+b. Por ejemplo, si el
modelo de iluminación reclama un color (35,42,48), se ubican r=2, g=4, b=3 y se
grafica el pixel con el índice de color 111. Con este esquema se produce el efecto
de “bandas de Mach” cuando se pintan áreas contiguas con colores parecidos.
Este efecto es producido por la capacidad del ojo de amplificar localmente
pequeñas variaciones cromáticas, lo cual le permite, entre otras cosas, reconocer
los bordes y las formas de los objetos. Sin embargo, el efecto que producen las
bandas de Mach al utilizar esta paleta de colores es indeseado ( ver Figura 21 ).
Pero a diferencia de lo que sucede con las paletas dinámicas, en nuestro esquema
es posible utilizar una técnica de dithering aleatorio, es decir, se puede “perturbar”
– UNAD
aleatoriamente un color dado cambiándolo por alguno de sus vecinos más

próximos en la paleta.
Figura 21 Paleta estática sin y con dithering aleatorio
Esto es así porque en nuestro modelo, dado un determinado color de la paleta, es

posible ubicar rápidamente a sus colores vecinos, los cuales, además, son muy
similares.
Una forma muy económica de producir este efecto consiste en perturbar para cada
primario la cuantización elegida. Si para el primario R se reclama un valor R, el cual
está comprendido entre rojo[r] y rojo[r+1] se perturbará la elección del valor r o r+1
en la generación del índice de color asociado al pixel (lo propio se efectúa con los
otros dos primarios). Para ello se genera un número aleatorio rnd uniformemente
R  rojo[r ]
distribuido entre 0 y 1. Si rnd  se utiliza r+1, y en caso contrario
rojo[r  1]  rojo[r ]
se utiliza r. En el ejemplo mencionado más arriba, la elección para la cuantización
del rojo está circunscripta a los valores predefinidos 32 o 45. Como 35 es más
cercano a 32 que a 45, la probabilidad de que se utilice dicho valor es mayor a la
de utilizar 45. De esa manera, se transforma el aliasing cromático producido por la
baja frecuencia de muestreo en un ruido uniforme.
CAPÍTULO 3 El hardware y el software para computación gráfica

Existen multitud de componentes que son necesarios para lograr realizar buenos
productos gráficos, sin embargo en este apartado nos centraremos en la
clasificación y características de los más comunes, a partir de una característica
– UNAD
fundamental: usan representación vectorial o ráster. Para ello se utiliza un

documento presentado por Claudio Delrieux.
Los resultados gráficos de una aplicación pueden mostrarse en una gran variedad
de dispositivos de salida. Normalmente estos dispositivos son o bien de pantalla o
bien de impresión. Sin embargo, desde el punto de vista de la Computación gráfica,
es importante otra clasificación, referida al modo en que los mismos son manejados
por la computadora. De esa manera, podemos ver que existen dispositivos de los
siguientes tipos:
 Dispositivos de vectores, los cuales reciben del computador la información

geométrica de la localización y tamaño de las primitivas que soportan, de las
cuales producen una reproducción “caligráfica”. En la representación
vectorial la imagen está igualmente constituida por puntos, pero en vez de
almacenar una matriz finita de puntos se almacenan vértices, reglas de
trazado de líneas y de coloreado de superficies y líneas. Las imágenes
vectoriales son más adecuadas que las de ráster (mapas de bits-bitmap)
para ciertos tipos de aplicaciones (dibujos técnicos, planos, cartografía, etc)
porque en realidad guardan reglas matemáticas, por lo que contra lo que
sucede conde
sin pérdida lascalidad.
imágenes ráster, pueden ser escaladas a cualquier tamaño
 Dispositivos de ráster. Los dispositivos de vectores fueron los primeros en
desarrollarse, pero luego del vertiginoso descenso en el costo de la memoria
volátil, a partir de la década del 70 se hicieron más baratos los dispositivos
de ráster. Esto implica un cambio en la manera de representar las primitivas
gráficas (usualmente dichas primitivas son el punto, el segmento de recta y
la circunferencia o el círculo). La representación ráster, como ya se explicó
en la sección anterior, también es denominada mapa de bits ("bit-map"),
consiste en sustituir los infinitos puntos de la imagen srcinal por un conjunto
finito de puntos, pixeles, tomados a intervalos regulares. Estos puntos
constituyen los nudos de una malla (generalmente las separaciones
horizontal ylos
representa vertical sonpuntos
infinitos iguales).
de laAimagen
partir de aquí,
real. el conjunto los
Posteriormente de pixeles
puntos
de color son reducidos a números para su almacenamiento y tratamiento en
el ordenador; el conjunto de valores numéricos adopta la forma de una
matriz a la que denominamos matriz-imagen. La forma en que un punto de
luz es reducido a un número varía según el método utilizado, este número, o
conjunto de números, debe indicar con precisión tanto el color (tono) como el
brillo (cuanta luz de dicho tono) y la saturación (pureza del color) de srcinal
correspondiente.
– UNAD
Lección 11 Dispositivos de vectores

Actualmente estos dispositivos son más caros, pero tienen ciertas ventajas que los
hacen únicos. Por ejemplo, tienen mucha mejor resolución y precisión que los
dispositivos de ráster, y requieren un ancho de banda de comunicación mucho
menor dado que no reciben la discretización completa de las primitivas sino
solamente su posición.
En síntesis los dispositivos vectoriales presentan las siguientes características.
 Las líneas se guardan de forma aleatoria.

 La velocidad de refresco depende del número de líneas.
 Si hay pocas líneas el sistema espera para evitar refrescar más de lo
necesario.
 Presentan problemas al intentar dibujar polígonos rellenos.
 Las posibilidades de color son mínimas.
 Las líneas son exactas en su trazo (no hay efecto escalera).
 La secuencia de dibujo es siempre la misma si no existe movimiento.
 Al borrar una línea, no se produce la estela.
Plotters: Grafican en una hoja (que en algunos casos puede ser de gran tamaño)
sobre la cual se desliza una pluma movida por motores de pasos de gran precisión.
En los plotters de tambor, la pluma se
desliza en sentido horizontal y el papel en
sentido vertical. En los plotters planos (más
económicos), el papel está fijo y la pluma
realiza todos los movimientos. Son usuales
las resoluciones del orden de los 10000 *
10000. Es posible utilizar colores por medio
Figura 22 Plotter de varias plumas. Son ideales para la
graficación rápida y precisa de planos.
Displays de almacenamiento: Al igual que televisores y monitores, estos

dispositivos son pantallas de rayos catódicos, pero difieren en ciertos aspectos
tecnológicos. Esencialmente, la pantalla tiene cierta “memoria” electrostática que
mantiene visibles los elementos graficados con muy alta precisión y sin la
necesidad de refresco. Por lo tanto, una imagen muy compleja a la cual se van
agregando elementos en orden es idealmente representada por estos dispositivos.
– UNAD
Un elemento se representa “pintándolo” por medio de una serie de recorridas del

cañón electrónico. El borrado, sin embargo, no puede hacerse en forma selectiva,
por lo que no se puede alterar la posición de un elemento sin tener que borrar y
redibujar todos los demás.
Sin embargo, su precisión y velocidad sin necesidad de memoria volátil los hace
ideales para la representación de imágenes de radares.
Lección 12 Dispositivos de ráster

Los dispositivos de barrido (ráster) surgen como alternativa. Los elementos del
dibujo se almacenan en forma de pixeles. Cada vez que se refresca la imagen el
cañón barre todos los pixeles.
Los dispositivos de barrido presentan las siguientes características:
 La imagen completa la forman líneas horizontales formadas por pixeles.

 Se realizan barridos de forma horizontal, de arriba a abajo.
 Para cada pixel se ajusta la intensidad del haz.
 El refresco tiene una frecuencia fija, entre 25 y 30 imágenes.
 Las órdenes de dibujo que recibe el controlador se transforman a pixeles.
 Incorporan fácilmente objetos rellenos (color o patrón).
 El costo es menor.
 La velocidad de refresco no depende de la complejidad de la imagen.
Dada la naturaleza discreta de los pixeles, es necesaria la conversión de primitivas
a pixeles. Los pixeles pueden dar apariencia de escalera (aliasing), para evitar
este efecto se han definido algoritmos y técnicas antialiasing.
Impresoras de matriz: Era hasta hace poco el dispositivo de impresión más
común. Recibe de la computadora la información gráfica como una secuencia
líneas, las cuales
de martillos va reproduciendo
o el rocío de tinta). con una cabeza impresora (por medio del golpe
Impresoras Laser: Recibe de la computadora la información gráfica como una

secuencia de líneas, las cuales almacena en una memoria local. Dicha memoria es
utilizada para comandar la intensidad de un haz laser que recorre línea por línea el
papel, mientras es expuesto al contacto del toner. Donde el haz incide con gran
intensidad, el papel se dilata por el calor y absorbe el toner.
– UNAD
Monitores: Se han popularizado enormemente a partir del descenso en el precio

de la memoria volátil y el incremento constante en la calidad de las prestaciones
(resolución, color, precisión). Esencialmente se comportan de una manera similar a
un receptor de televisión, excepto por el hecho de que reciben la señal de video y
sincronismo en forma directa de la computadora y no a través de una portadora de
radio. Al igual que con las impresoras de matriz, la imagen se construye línea por
línea, en sentido horizontal primero (de izquierda a derecha) y vertical después (de
arriba abajo). Debe existir un refresco de la imagen en memoria, la cual es
recorrida por la tarjeta gráfica de la computadora para producir las líneas de
barrido.
Los monitores más populares pueden tener resoluciones de hasta 1200 * 1024
pixeles (aunque este límite avanza día a día), con una cantidad de colores limitada
por las prestaciones de la tarjeta gráfica. Esto representa una calidad más que
aceptable para la mayor parte de las aplicaciones. A continuación se presentan los
diferentes estándares y su capacidad de resolución:
Estándar Resolución Número de colores
CGA (color graphics adapter) 320x200 4

640x200 2
EGA (enhanced graphics adapter) 640x200 16
640x350 16
MCGA (multicolor graphics array) 640x200 2
640x480 2
320x200 4
VGA (video graphics array) 320x200 256
640x480 16
8514/A 1024x768 256 (entrelazado)
XGA (extended graphics adapter) 1024x768 256 (no entrelazado)
1280x1024 256 (entrelazado)
SVGA (super VGA) 640x480 256
800x600 32k
1024x768 64k
1280x1024 16.8M
1600x1200
...
Lección 13 Hardware gráfico para monitores - La tarjeta de video

Los dispositivos de ráster requieren un refresco permanente de la discretización de
la salida gráfica. En el caso de los monitores, dicho refresco se realiza en un
segmento de la memoria volátil de la computadora denominada frame buffer o
buffer de pantalla, que usualmente se implementa por medio de memoria RAM de
– UNAD
alta velocidad localizada dentro de la tarjeta gráfica. El buffer de pantalla es

accedido en forma rítmica por el generador de video, que es el encargado de
“componer” la señal de video que va hacia el monitor. Al mismo tiempo, al
producirse una salida gráfica por parte de la CPU de la computadora, la misma
debe ser discretizada y almacenada en el buffer de pantalla. Este acceso debe ser
permitido solamente en los momentos en los que el generador de video no está
accediendo al buffer, y por lo tanto se requiere el uso de un árbitro que mantenga
abierto el acceso al buffer solo en esos casos.
Tarjeta gráfica El temporizado es crítico en el manejo del

buffer de pantalla, por lo que se requiere
Frame
CPU Arbitro
Buffer memoria RAM de alta velocidad, mucho
mayor que la velocidad requerida para la
Generador de video RAM de la CPU. Por ejemplo, en una
norma de video de 1024 pixeles por
línea, la pantalla es refrescada 35 veces
MONITOR por segundo a una tasa de
aproximadamente un millón de pixeles
Figura 23 Componentes básicos de una por pantalla.
tarjeta gráfica
Esto significa que en promedio el buffer de pantalla es accedido 35 millones de

veces por segundo por el generador de video, lo cual requiere una velocidad de
acceso a memoria de aproximadamente 30ns para cumplir sólo con el refresco de
pantalla. En una situación como esta, utilizar memoria de 25ns. para el buffer de
pantalla permite utilizar solamente un pico de 5 millones de accesos por segundo
para la CPU, lo cual en muchos casos es insuficiente si se tiene en cuenta que el
acceso entre la CPU y la tarjeta gráfica por el bus ISA debe cumplir cierto protocolo
que hace más lenta la comunicación.
Otro esquema posible para manejar la memoria de pantalla es utilizar la tecnología
de bus local (difundida alrededor de 1993 con las motherboard 486 y tarjetas Vesa
Local Bus). Básicamente la idea es evitar el uso del bus de datos ISA para
interconectar la tarjeta gráfica con la CPU. De ese modo se utiliza un segundo bus
(llamado bus local), normalmente de 32 bits en vez de 16, con la velocidad del reloj
externo del microprocesador (50Mhz. en vez de 8.33) y con capacidad de acceso
directo a memoria.
– UNAD
Este tipo de configuraciones Tarjeta gráfica

permite una mejor utilización del
ancho de banda marginal de la Frame Generador
MONITOR
memoria del frame buffer, y por lo Buffer de video
tanto, en determinadas
aplicaciones, como por ejemplo
animaciones, la prestación de un
mismo hardware aumenta en un Bus Local
orden de magnitud solamente al
modificar la configuración de CPU RAM
acceso. Figura 24 Tarjeta gráfica con tecnología de bus local
Por otra parte, muchas de las operaciones matemáticas necesarias dentro en la

computación gráfica siguen un procesamiento disciplinado que puede en muchos
casos implementarse directamente en el hardware de la tarjeta. Es por dicha razón
que han surgido tarjetas aceleradoras por hardware (PCI o AGP) que permiten que
una aplicación se deslinde del trabajo de efectuar las transformaciones
geométricas, pintado de polígonos, el mapeo de texturas, etc.

Recapitulando, la clave del funcionamiento de la tarjeta gráfica no está en los
requisitos de memoria, sino en la estructura del generador de video. El generador
de video debe recorrer la memoria del buffer de pantalla y entregar las líneas de
barrido al monitor dentro de una determinada norma de video. Dicha norma puede
ser una norma de televisión (PAL o NTSC) o de monitor (1024*768, 800*600, etc.).
Entonces, el barrido es producido por un generador de barrido cuyas frecuencias
horizontal y vertical son programables en función de la norma que se utiliza.
Las señales de barrido son enviadas al monitor, pero también se utilizan para
encontrar la posición de memoria en la cual está almacenada la información gráfica
de cada pixel que constituye una línea de barrido. Esto se realiza por medio de una
unidad
señal dearitmética que encuentra
barrido horizontal una La
y vertical. dirección lineal
dirección a partir
lineal de lalossalida
habilita valores
del de la
valor
almacenado en un lugar de la memoria del buffer de pantalla. Dicho valor es
transformado en información gráfica por medio de una tabla de color, excepto en el
modo true color (color verdadero) que se explicará más adelante.
– UNAD
Lección 14 Dispositivos de entrada

Los dispositivos de entrada permiten la interacción del usuario con el objeto gráfico
creado. Estos dispositivos se pueden clasificar en teclados, apuntadores de control
directo, apuntadores de control indirecto y apuntadores de última tecnología.
Figura 25 Diferentes tipos de teclado, incluido el teclado virtual
Un teclado está realizado mediante un microcontrolador, normalmente de las

familias 8048 u 8051 de Intel. Estos microcontroladores ejecutan sus propios
programas que están grabados en sus respectivas ROMs internas. Estos
programas realizan la exploración matricial de las teclas para determinar cuales
están pulsadas.
Para lograr un sistema flexible los microcontroladores no identifican cada tecla con
su carácter serigrafiado en la misma, sino que se adjudica un valor numérico a
cada una de ellas que sólo tiene que ver con su posición física. Si no se hiciera así
ese sistema sería muy dependiente de cada idioma, también hay que tener en
cuenta que idiomas como por ejemplo en francés tienen teclados AZERTY en lugar
del que se tiene en Estados Unidos QWERTY.
Los teclados usados en América latina y España extienden la configuración básica
del teclado QWERTY con el fin de incluir la letra eñe y facilidades para letras
acentuadas. Como el teclado español debe servir para las diversas lenguas de la
península ibérica se facilita sobre todo la escritura de diversos acentos aún los no
utilizados en el castellano. El teclado latinoamericano sólo da soporte con teclas
directas a los caracteres específicos del castellano, que incluyen dos tipos de
acento, la letra eñe y los inicios de exclamación e interrogación. El resto de
combinaciones de acentos se obtienen usando una tecla de extensión de grafismos
(<ALT-GR>). Por lo demás el teclado latinoamericano está orientado hacia la
programación, con fácil acceso al juego de símbolos de la norma ASCII.
– UNAD
Por cada pulsación o liberación de una tecla el microcontrolador envía un código

identificativo que se llama Scan Code. Para permitir que varias teclas sean
pulsadas simultáneamente, el teclado genera un código diferente cuando una tecla
se pulsa y cuando dicha tecla se libera.
En los teclados AT los códigos generados son diferentes, por lo que por razones de
compatibilidad es necesario traducirlos. De esta función se encarga el controlador
de teclado que es otro microcontrolador (normalmente el 8042), éste ya situado en
el PC. Este controlador recibe el Keyboard Scan Code (Kscan Code) y genera el
propiamente dicho Scan Code. En cualquier caso ya sea teclado PS/2 ó AT el Scan
Code es entregado a la BIOS del PC para identificar la tecla pulsada.
La comunicación del teclado es vía serie. El protocolo de comunicación es
bidireccional, por lo que el computador puede enviarle comandos al teclado para
configurarlo, resetearlo, realizar diagnósticos, etc.
Los apuntadores de control directo permiten señalar directamente sobre la
pantalla o monitor el objeto deseado, un ejemplo muy común son las pantallas
sensibles al tacto y los lápices ópticos (ligth pen).
Figura 26 Dispositivos con apuntadores de control directo
El lápiz óptico contiene sensores luminosos y envía una señal a la computadora

cada vez que registra una luz, por ejemplo al tocar la pantalla cuando los pixeles no
negros que se encuentran bajo la punta del lápiz son refrescados por el haz de
electrones de la pantalla. La pantalla de la computadora no se ilumina en su
totalidad al mismo tiempo, sino que el haz de electrones que ilumina los pixeles los
recorre línea por línea, todas en un espacio de 1/50 de segundo. Detectando el
momento en que el haz de electrones pasa bajo la punta del lápiz óptico, el
ordenador puede determinar la posición del lápiz en la pantalla.
– UNAD
El lápiz óptico no requiere una pantalla ni un recubrimiento especiales como puede

ser el caso de una pantalla táctil, pero tiene la desventaja de que sostener el lápiz
contra la pantalla durante periodos largos de tiempo llega a cansar al usuario.
En cuanto a las pantallas, el tipo de pantalla táctil más sencillo está compuesto de
una red de líneas sensibles, que determinan la situación de una presión mediante
la unión de los contactos verticales y horizontales.
Otros tipos de pantallas más precisas utilizan una superficie cargada
eléctricamente y sensores alrededor de los bordes externos de la pantalla, para
detectar la cantidad de cambio eléctrico y señalar exactamente donde se ha
realizado el contacto. Un tercer tipo fija diodos emisores de rayos infrarrojos (LEDs,
acrónimo de Light-Emitting Diodes) y sensores alrededor de los bordes externos de
la pantalla. Estos LEDs y sensores crean una red invisible de infrarrojos en la parte
delantera de la pantalla que interrumpe el usuario con sus dedos.
Las pantallas táctiles de infrarrojos se usan a menudo en entornos sucios, donde la
suciedad podría interferir en el modo de operación de otros tipos de pantallas
táctiles. La popularidad de las pantallas táctiles entre los usuarios se ha visto
limitada porque es necesario mantener las manos en el aire para señalar la
pantalla, lo que sería demasiado incómodo en largos periodos de tiempo. Además
no ofrece gran precisión al tener que señalar ciertos elementos en programas de
alta resolución. Las pantallas táctiles, sin embargo, son enormemente populares en
aplicaciones como los puestos de información porque ofrecen una forma de señalar
que no requiere ningún hardware móvil y porque presionar la pantalla es algo
intuitivo.
En cuanto a los apuntadores de control indirecto, con el ratón constituyen los de
uso más extendido en conjunto con los teclados. Estos apuntadores están
constituidos por dispositivos externos que permiten manejar un apuntador gráfico
en el monitor, mediante su movimiento y realizar acciones sobre los objetos
mediante botones.
Figura 27 Dispositivos apuntadores indirectos: ratón, touchpad, trackpoint, joystick, tableta gráfica, etc.
– UNAD
Los ratones (mouse) suelen estar constituidos por una caja con una forma más o
menos anatómica en la que se encuentran dos botones que harán los famosos
clics de ratón siendo transmitidos por el cable al puerto PS/II o al puerto de serie.
Los ratones mecánicos mantienen dentro de esta caja una bola que sobresale de la
caja a la que se pegan 4 rodillos ortogonalmente dispuestos que serán los que
definan la dirección de movimiento del ratón. El ratón se mueve por una alfombrilla
ocasionando el movimiento de la bola que a su vez srcina el movimiento de uno o
varios de estos rodillos que se transforma en señales eléctricas y producen el
efecto de desplazamiento del ratón por la pantalla del ordenador.
Existen modelos en los que la transmisión se hace por infrarrojos eliminando por
tanto la necesidad de cableado. Otros presentan la bola en la parte superior de la
caja no estando por tanto en contacto con la alfombrilla y teniendo que ser movida
por los dedos del usuario aunque se srcina el mismo efecto. Otros utilizan diodos
emisores de luz (led), para capturar el movimiento del ratón, en este caso se
denominan ratones ópticos.
Figura 28 Apuntadores de última tecnología
Los apuntadores de última tecnología permiten la captura de movimientos en

espacios tridimensionales y por ende la manipulación de objetos tridimensionales.
Lección 15 Software de graficación

Hasta la llegada del software 3D la mayoría de los efectos especiales se realizaban
por medio de efectos ópticos, maquetas, matte painting, etc. Con el software de
graficación en 3D se puede imitar la realidad con tal realismo, que es difícil detectar
si la escena se ha rodado o se ha generado en un ordenador. Esto ha quedado
patente en muchas películas, que ya hemos mencionado.
– UNAD
Los paquetes de animación consisten en uno o varios módulos con los que es
posible modelar, animar y dar apariencia real a un objeto. En un principio, las
empresas de animación programaban su propio software con el cual luego
trabajaban. Poco a poco fueron surgiendo distintos programas, los cuales podían
ser adquiridos a través de una licencia de uso.
El proceso de creación de gráficos 3D por computadora puede ser dividido en estas
tres fases básicas:
 Modelado
 Composición de la escena
 Rénder (creación de la imagen final)
Modelado. La etapa de modelado consta de ir dando forma a objetos individuales

que luego serán usados en la escena. Existen diversas técnicas de modelado;
Constructive Solid Geometry, modelado con NURBS y modelado poligonal son
algunos ejemplos. Los procesos de modelado pueden incluir la edición de la
superficie del objeto o las propiedades del material (por ejemplo, color,
luminosidad, difusión, especularidad, características de reflexión, transparencia u
opacidad, o el índice de refracción), agregar texturas, mapas de relieve (bump-
maps) y otras características.
El proceso de modelado puede incluir algunas actividades relacionadas con la
preparación del modelo 3D para su posterior animación. A los objetos se les puede
asignar un esqueleto, una estructura central con la capacidad de afectar la forma y
movimientos de ese objeto. Esto ayuda al proceso de animación, en el cual el
movimiento del esqueleto afectará automáticamente las porciones
correspondientes del modelo. Dos técnicas para realizar la animación son
Cinemática Directa (Forward Kinematic animation) y animación por Cinemática
Inversa (Inverse Kinematic animation).
El modelado puede ser realizado por programas dedicados (como Lightwave 3D,
Rhinoceros 3D o Moray), un componente de una aplicación (Shaper, Lofter en 3D
Studio) o por un lenguaje de descripción de escenas (como en POV-Ray. En
algunos casos, no hay una distinción estricta entre estas fases; en dichos casos, el
modelado es sólo una parte del proceso de creación de escenas (por ejemplo, con
Caligari trueSpace).
Composición de la escena . Esta etapa involucra la distribución de objetos, luces,
cámaras y otras entidades en una escena que será utilizada para producir una
imagen estática o una animación. Si se utiliza para Animación, esta fase, en
– UNAD
general, hace uso de una técnica llamada "Keyframing" (cuadros clave), que facilita
la creación de movimientos complicados en la escena. Con la ayuda de la técnica
de keyframing, en lugar de tener que corregir la posición de un objeto, su rotación o
tamaño en cada cuadro de la animación, solo se necesita marcar algunos cuadros
clave (keyframes). Los cuadros entre keyframes son generados automáticamente,
lo que se conoce como 'Interpolación'.
La iluminación es un aspecto importante de la composición de la escena. Como en

la realidad, la iluminación es un factor importante que contribuye al resultado
estético y a la calidad visual del trabajo terminado. Por eso, puede ser un arte difícil
de dominar. Los efectos de iluminación pueden contribuir en gran medida al humor
y la respuesta emocional generada por la escena, algo que es bien conocido por
fotógrafos y técnicos de iluminación teatral.
Tesselation y mallas. El proceso de transformar la representación de objetos,
como el punto medio de coordenadas de una esfera y un punto en su
circunferencia, en una representación poligonal de una esfera, se conoce como
tesselation. Este paso es usado en el rénder basado en polígonos, donde los
objetos son descompuestos de representaciones abstractas primitivas como
esferas, conos, etcétera, en las denominadas mallas, que son redes de triángulos
interconectados.
Las mallas de triángulos son populares ya que está probado que son fáciles de
'renderizar' usando Scanline rendering.
Las representaciones poligonales no son utilizadas en todas las técnicas de rénder,
y en estos casos, el paso de tesselation no es incluido en la transición de
representación abstracta y la escena 'renderizada'.
Renderizado. Se llama rénder al proceso final de generar la imagen 2D o
animación a partir de la escena creada. Esto puede ser comparado a tomar una
foto o en el caso de la animación, a filmar una escena de la vida real.
Generalmente se buscan imágenes de calidad fotorrealista, y para este fin se han
desarrollado muchos métodos especiales. Las técnicas van desde las más
sencillas, como el rénder de alambre (wireframe rendering), pasando por el rénder
basado en polígonos, hasta las técnicas más modernas como el Scanline
Rendering, el Raytracing, la radiosidad o el Mapeado de fotones.
El software de rénder puede simular efectos cinematográficos como el lens flare, la
profundidad de campo, o el motion blur (desenfoque de movimiento). Estos
artefactos son, en realidad, un producto de las imperfecciones mecánicas de la
fotografía física, pero como el ojo humano está acostumbrado a su presencia, la
– UNAD
simulación de dichos efectos aportan un elemento de realismo a la escena. Se han

desarrollado técnicas con el propósito de simular otros efectos de srcen natural,
como la interacción de la luz con la atmósfera o el humo. Ejemplos de estas
técnicas incluyen los sistemas de partículas que pueden simular lluvia, humo o
fuego, el muestreo volumétrico para simular niebla, polvo y otros efectos
atmosféricos, y las cáusticas para simular el efecto de la luz al atravesar superficies
refractantes.
El proceso de rénder necesita una gran capacidad de cálculo, pues requiere
simular gran cantidad de procesos físicos complejos. La capacidad de cálculo se ha
incrementado rápidamente a través de los años, permitiendo un grado superior de
realismo en los rénders. Estudios de cine que producen animaciones generadas
por ordenador hacen uso, en general, de lo que se conoce como rénder farm
(granja de rénder) para acelerar la producción de fotogramas
A pesar de haber muchos paquetes de modelado y animación 3D, los cuatro que
se han ganado la mayor popularidad son:
 Alias Wavefront's Maya - Es quizá el software más popular en la industria,
por lo menos hasta 2003. Es utilizado por muchos de los estudios de efectos
visuales más importantes en combinación con RenderMan, el motor de
rénder fotorrealista de Pixar.
 Discreet's 3D Studio Max - Originalmente escrito por Kinetix (una división de
Autodesk) como el sucesor de 3D Studio. Kinetix luego se fusionó con la
última adquisición de Autodesk, Discreet Logic. Es el líder en el desarrollo de
3D en la industria de juegos y usuarios hogareños.
 Newtek's Lightwave 3D - Fue srcinalmente desarrollado por Amiga
Computers a principios de la década de 1990. Más tarde evolucionó en un
avanzado y muy usado paquete de gráficos y animación 3D. Actualmente
disponible para Windows, Mac OS y Mac OS X.. El programa consiste en
dos componentes: Modelador y Editor de escena. Es el favorito entre los
entusiastas, y es utilizado en muchas de las mayores productoras de efectos
visuales como Digital Domain.
 Avid's Softimage XSI - El contrincante más grande de Maya. En 1987,
Softimage Inc, una compañía situada en Montreal, escribió Softimage 3D,
que se convirtió rápidamente en el programa de 3D más popular de ese
período. En 1994, Microsoft compró Softimage Inc. y comenzaron a
reescribir SoftImage 3D para Windows NT. El resultado se llamó
SoftimageXSI. En 1998 Microsoft vendió Softimage a Avid.
– UNAD
Junto a estos paquetes mayores, hay otros que no se han ganado tal aceptación
general, pero que no son simples juguetes. Algunos son:
 Caligari trueSpace - una aplicación 3D integrada, con una interfaz muy

intuitiva. Una característica distintiva de esta aplicación es que todas las
fases de creación de gráficos 3D son realizadas dentro de un único
programa. No es tan avanzado como los paquetes líderes, pero provee
características como simulación de fenómenos físicos (viento, gravedad,
colisiones entre cuerpos).
 Cinema4d - Motor de rénder rápido, cálculo de radiosidad.
 formZ - Ofrece manipulación topológica de las geometrías.
 Rhinoceros 3D - Un potente modelador bajo NURBS.
 POV-Ray - Un avanzado software gratuito de Raytracing. Usa su propio
lenguaje de descripción de escena, con características como macros, bucles
y declaraciones condicionales. Es completamente gratuito aunque no fue
lanzado bajo GPL. No incluye modelador.
 NaN*Blender - Programa de modelado y animación libre, con características
como soporte para programación bajo Python con un amplia gamma de
script en constante desarrollo, posee un motor robusto para la programación
de juegos, un Motor de rénder propio y una comunidad de usuarios
totalmente abierta y dispuesta a colaborar.
 RealSoft3D - Modelador 3D para Linux y Windows. Incluye rénder.
 Universe por Electric Image - Paquete de modelado y animación con uno de
los motores de rénder más rápidos que existen.
Cada software tiene sus ventajas y desventajas frente a los demás, pero la
posibilidad de realizar un trabajo de calidad no depende de esto, sino de los
conocimientos, la creatividad, y no tanto del software.
Además del software especializado, es común el manejo de A PI’s especializadas
para facilitar los procesos en todas las etapas de la generación de gráficos por
computadora.
hardware paraEstas APIs han
gráficos por demostrado ser vitales
computadora, ya quepara los desarrolladores
proveen un camino de al
programador para acceder al hardware de manera abstracta, aprovechando las
ventajas de tal o cual tarjeta de video.
Las siguientes APIs para gráficos por computadora son particularmente populares:
 OpenGL
 Direct3D (subconjunto de DirectX para producir gráficos interactivos en 3D)
 RenderMan
– UNAD
Fuentes documentales unidad 1

BAECKER, J. GRUDIN, W. BUXTON & s. GREENBERG (eds) "Readings in
Human-Computer Interaction: toward the year 2000". Second Edition. Morgan-
Kauffmann. 1997.
CEBRIÁN, Rafael. Teoría del color. [En línea]
http://www.lilliputmodel.com/articulos/cebrian/teoria_color1.htm.
Mayo de 2005. Fecha de consulta:
CONDE RODRÍGUEZ, Francisco de Asís. Charla sobre: La infografía y los efectos

especiales en el cine. En el Foro sobre Juventud y Nuevas Tecnologías. [En línea]
http://wwwdi.ujaen.es/~fconde/Confe-infografia.pdf. Fecha de consulta:
Septiembre de 2005.
DELRIEUX, Claudio. Introducción a la Computación gráfica. Departamento de
Ingeniería Eléctrica. Universidad Nacional del Sur. [En línea]
http://www.memi.umss.edu.bo/~mscinfo/cursos/graficos/main.htm. Fecha de
consulta: Septiembre de 2005.
DESARROLLOWEB.COM. Curso práctico de diseño web. Informe de Luciano
Moreno [En línea] http://www.desarrolloweb.com/articulos/1483.php?manual=47.
Fecha de consulta: Mayo de 2005.
IMPAGLIAZZO, John. Learning Computing History. A Brief History of Computer
Graphics [En línea] http://www.comphist.org/computing_history/new_page_6.htm.
Última actualización: Septiembre 15 de 2005. Fecha de consulta: Septiembre de
2005.
MORENO, Luciano. Gráficos digitales [En Línea]
http://www.htmlweb.net/diseno/graficos_digitales/graficos_3.html Fecha de
consulta: Mayo de 2005
OUTING, Steve. “News sites repeat mistakes of the past. We still don´t recognize
the power of interactivity”. Editor & Publisher. 4 de Mayo. VNU eMedia Inc.
Consultado en abril de 2002 en:
www.editorandpublisher.com/editorandpublisher/features_columns/article_display.js
p?vnu_content_id=1461161
PASCUAL BRONCANO, Pedro J. y GUTIÉRREZ, Antonio. Conceptos
fundamentales de computación gráfica. [En línea]
http://www.ii.uam.es/~pedro/graficos/teoria/Conceptos/ConceptosFundamentales.ht
– UNAD
m#estandar. Escuela Técnica Superior de Informática de la Universidad Autónoma

de Madrid, 1998-2000. Última actualización: 03/07/2004. Fecha de consulta:
Septiembre de 2005.
PREECE, Y. ROGERS, H. SHARP, D. BENYON, S. HOLLAND, T. Carey. "Human-
Computer Interaction", Addison-Wesley, 1994
TYPEPHASES DESIGN. Manual de diseño Fecha

http://platea.cnice.mecd.es/~jmas/manual/html/uso.html digital. [En
de consulta: línea]
Mayo
de 2005.
UNIVERSITAT J’AUME I. Material teórico para el curso Multimedia. [En línea]
http://www4.uji.es/~belfern/IX34/Documentos/Teoria/Animacion.pdf.
http://www4.uji.es/~belfern/IX34/Documentos/Teoria/Video.pdf,
http://www4.uji.es/~belfern/IX34/Documentos/Teoria/Graficos.pdf Fecha de
consulta: Mayo de 2005.
– UNAD
UNIDAD 2 ALGORITMOS BÁSICOS DE DIBUJO EN 2 DIMENSIONES

Introducción
Una vez se han clarificado algunos de los fundamentos de la computación gráfica
es necesario abordar el proceso de representación. En esta segunda unidad
didáctica se van a encontrar los métodos para graficar las primitivas básicas:
rectas, círculos,
llenado de áreas ypolígonos, para posteriormente abordar lo correspondiente a
transformaciones.
Para ello se parte de la conceptualización matemática de cada una de estas
primitivas, llegando al proceso de discretización necesario para su dibujo en un
dispositivo como el monitor. Aunque muchos de los lenguajes computacionales ya
tienen definidas en sus librerías gráficas funciones que permiten dibujar estas
primitivas sin tener que incluirse en el problema de la discretización, la idea
fundamental es conocer ¿cómo funciona el dibujado en el monitor, a partir de su
unidad básica: el píxel? Se espera que este conocimiento redunde en un mejor
manejo de los algoritmos que describen este proceso.
En cada uno de los algoritmos básicos se proporciona la codificación en lenguaje
Java con el fin de acercarlo a la programación. En la próxima unidad se mostrará
con un mayor nivel de detalle las posibilidades de un API para la graficación. Aquí
dará sus primeros pasos....pero serán esenciales.
Propósitos
Introducir al estudiante en el conocimiento de los principales algoritmos y
estructuras de datos utilizados en Computación Gráfica para modelar y
visualizar escenas en 2 y 3 dimensiones, como fundamento para la
visualización gráfica en el computador.
Proporcionar al estudiante los lineamientos tecnológicos básicos que le
permitan utilizar librerías gráficas (Ej. OpenGL) en conjunto con lenguajes de
programación estructurada como JAVA.
Objetivos
Conocer los algoritmos necesarios para el trazado de curvas en dos
dimensiones, a partir del estudio de su srcen matemático, geométrico y la
– UNAD
ejemplificación utilizando librerías gráficas en conjunto con leguajes de

programación.
Elaborar ejercicios de llenado de áreas y transformaciones de figuras de dos
dimensiones, utilizando librerías gráficas y lenguajes de programación,
partiendo de la conceptualización geométrica respectiva.
Competencias
El estudiante programa empleando algoritmos que permiten dibujar las
principales figuras geométricas en dos dimensiones.
El estudiante conoce los fundamentos matemáticos de la representación de
gráficos computacionales en tres dimensiones y utiliza los algoritmos que las
realizan.
Metas
 Usar librerías gráficas para la construcción de gráficos computacionales.

 Utilizar y construir algoritmos para dibujo de gráficos en 2D y 3D.
 Describir el funcionamiento matemático y geométrico que permite el
dibujo de gráficos en el computador.

– UNAD
Individual
 Consultar en internet sobre los temas de la unidad y publicar preguntas en el
foro de la unidad correspondiente para que sean solucionadas por el tutor o

los compañeros.
 Sustentación individual de los programas desarrollados.
Desarrollo de tres (3) ejercicios de programación aplicando algoritmos de
graficación en JAVA. Los enunciados serán entregados por el tutor indicando las
fechas y condiciones de entrega.
Grupo de Curso
 Por cada tipo de algoritmo que se estudia se realizará una práctica en
computadores, para repasar los conceptos básicos y probar los algoritmos
codificados en JAVA.
unidad.
CAPÍTULO 4 Requerimientos de software

Este capítulo presenta las herramientas necesarias para la construcción y
ejecución de programas en el lenguaje de programación JAVA, los requerimientos
mínimos de hardware y software para su correcto funcionamiento y los comandos
básicos para su implementación.

Lección 16 JDK
El JDK (Java Development Kit) comprende todas las herramientas necesarias para
la programación en JAVA, a continuación se presenta una relación de sus
principales componentes:
java Gestor de aplicaciones Java. Esta herramienta es el intérprete de
los archivos de clase generados por el javac (compilador).
– UNAD
javac Compilador de aplicaciones Java, convierte el código fuente en

bytecode de Java.
appletviewer Esta herramienta es empleada para ejecutar y depurar
aplicaciones Java sin necesidad de un navegador web.
javadoc Generador de documentación, genera automáticamente la
documentación del código

comentarios insertados fuente
en cada desarrollado a partir de los
archivo.
jar Archivador, permite empaquetar en un único archivo JAR las
librerías de clase empleadas en un programa desarrollado.
16.1 Instalación de la herramienta

Para realizar la instalación del JDK de JAVA es necesario descargarlo desde la
página http://www.oracle.com/technetwork/java/javase/downloads/index.html, allí
deberá hacer clic en el enlace de descarga y seleccionar el instalador
correspondiente a su sistema operativo.
Figura 29 Descarga del Instalador JDK

– UNAD
Lección 17 Estructura básica de un programa en JAVA

El desarrollo de un programa en JAVA requiere los siguientes componentes
básicos en su estructura:
import java.awt.*; // Declaración de librerías de clase a emplear
//package prueba; // Declaración del paquete contenedor
public class nclase { // Declaración de la clase (nombre de la clase)

public nclase() { // Declaración del constructor de la clase
System.out.print("Texto a mostrar"); // Instrucciones (solo muestra un texto en pantalla)
} // Fin del constructor
public static void main(String[] args) { // Declaración del método principal
nclase prueba = new nclase(); // Creación de una instancia de la clase
} // Fin del método principal
} // Fin de la clase
Algunos apuntes para programar en Java:
 El lenguaje de programación Java es fuertemente tipado por lo cual debe

prestarse mucha atención a los nombres de librerías, clases, comandos etc.
(distinguiendo mayúsculas y minúsculas).
 Al documentar el código fuente se suelen emplear comentarios, estos se
pueden emplear de la siguiente manera:
o Comentariosde una sola línea: // comentario
o Comentarios de más de una línea: /* comentarios… */
o Comentarios de documentación: /** comentarios… */
 Una sentencia es una instrucción que se le da al programa para realizar una
tarea específica, toda sentencia debe finalizar con “;” ej. import java.awt.*;
 Un identificador es el nombre que identifica a una clase, una variable, un
método o una función, estos siguen las siguientes reglas:
o
o
Debe
No iniciar
puede con una
emplear letra, elreservadas
palabras carácter subrayado (_) o por
(ej. utilizadas signo peso ($).
el lenguaje).
o No puede contener espacios en blanco.
o Puede contener pero no iniciar por números.
– UNAD
Lección 18 Tipos de datos y variables

18.1 Tipos de datos primitivos
Java soporta los siguientes tipos de datos:
boolean Comprende dos valores true o false.
char Caracteres
mismos queUnicode de con
los ASCII 16 el
bitsbit Los caracteres
alto puesto a 0.alfa-numéricos
Valores desde son los
0 hasta
65535 (valores de 16-bits sin signo).
byte Tamaño 8 bits. Valores desde -27 hasta 27 -1 (-128 a 127)
short Tamaño 16 bits. Valores desde -215 hasta 215-1 (-32768 a 32767)
int Tamaño 32 bits. Valores desde -231 hasta 231-1 (-2147483648 a

2147483647)
long Tamaño 64 bits. Valores desde -263 hasta 263-1 (-9223372036854775808

a 9223372036854775807)
float Tamaño 32 bits. Números en coma flotante de simple precisión. Estándar

IEEE 754-1985 (de 1.40239846e–45f a 3.40282347e+38f)
double Tamaño 64 bits. Números en coma flotante de doble precisión. Estándar
IEEE 754-1985. (de 4.94065645841246544e–324d a
1.7976931348623157e+308d.)
Sin embargo los tipos de datos mayormente empleados en la programación básica

con JAVA son boolean, int y double.
18.2. Caracteres
En Java los caracteres no están limitados a los presentes en la tabla ASCII, son
Unicode. Un caracter se presenta siempre entre comillas simples ej. 'A', '5', 'ó', etc.
El tipo de dato char se emplea para almacenar estos caracteres.
Un tipo especial de caracteres comprenden la secuencia de escape, empleados
para representar caracteres de control o caracteres que no se imprimen. Una
secuencia de escape está formada por la barra invertida (\) y un caracter. La
siguiente tabla presenta las secuencias de escape más utilizadas.
– UNAD
\r Retorno de carro (hace que se mueva el cursor a la primera posición de una línea)
\t Tabulador horizontal (genera un espacio de separación entre caracteres)
\n Nueva línea (indica el final de una línea de texto y el paso a la siguiente).
\\ Escribe una barra invertida.
18.3 Variables
booleanas Una variable booleana solamente puede guardar uno de los
dos posibles valores: true (verdadero) y false (falso). Ej.
boolean var1 = true;
enteras Una variable entera corresponde a cualquier combinación de

cifras precedida por el signo más + (opcional), para los
positivos, o el signo menos -, para los negativos. Ej.int var1 =
-254; las variables enteras se enuncian en java con las
palabras reservadas (int, byte, short, int, long) según la
longitud de los valores a contener.
en coma flotante Las variables del tipo float o double (coma flotante) se
emplean para almacenar valores que poseen parte entera y
parte decimal. Ej.float var1 = 4.3f; double var1 = 3.5;
Valores constantes Cuando se declara una variable de tipo final, su valor

permanece y no es posible modificarlo durante la ejecución del
programa. Ej. final int VAR1=256;
Lección 19 IDE para JAVA

El JDK (Java Development Kit) de Java presentado previamente no contiene un
IDE (Integrated Development Environment - Entorno de desarrollo integrado). Sin
embargo existen multiples alternativas independientes.
A continuación se presentan algunas de los IDE para JAVA más populares:
IntelliJ IDEA: Considerado uno de los mejores entornos de desarrollo, posee

soporte para multiples lenguajes de programación.
– UNAD
Figura 30 Entorno del IDE intelliJ IDEA
Las siguientes son algunas de sus principales características:
 Asistencia inteligente de codificación

 Generación de código
 Estilo de código
 Documentación de código
 Navegación y búsqueda
 Análisis de código sobre la marcha
 Propiedades del editor de archivos
 Diseñador de GUI Swing
 Diagramación de clases UML
Eclipse: Entorno de desarrollo integrado de código abierto multiplataforma, el

entorno de desarrollo integrado (IDE) de Eclipse emplea módulos (plug-in) para
– UNAD
proporcionar toda su funcionalidad al frente de la plataforma de cliente enriquecido,

a diferencia de otros entornos monolíticos donde las funcionalidades están todas
incluidas, las necesite el usuario o no.
El SDK de Eclipse incluye las herramientas de desarrollo de Java, ofreciendo un
IDE con un compilador de Java interno y un modelo completo de los archivos
fuente de Java. Esto permite técnicas avanzadas de refactorización y análisis de
código.
Figura 31 Entorno del IDE Eclipse
Las siguientes son algunas de sus principales características:

 Editor de texto con resaltado de sintaxis
 Compilación es en tiempo real
 Control de versiones con CVS
 Integración con Ant
 Asistentes (wizards) para creación de proyectos
– UNAD
Netbeans: NetBeans es un proyecto de código abierto de gran éxito con una gran
base de usuarios, una comunidad en constante crecimiento, y con cerca de 100
socios en todo el mundo. Sun MicroSystems fundó el proyecto de código abierto
NetBeans en junio de 2000 y continúa siendo el patrocinador principal de los
proyectos.
La plataforma NetBeans permite que las aplicaciones sean desarrolladas a partir de
un conjunto de componentes de software llamados módulos. Un módulo es un
archivo Java que contiene clases de java escritas para interactuar con las APIs de
NetBeans y un archivo especial (manifest file) que lo identifica como módulo. Las
aplicaciones construidas a partir de módulos pueden ser extendidas agregándole
nuevos módulos. Debido a que los módulos pueden ser desarrollados
independientemente, las aplicaciones basadas en la plataforma NetBeans pueden
ser extendidas fácilmente por otros desarrolladores de software.
Figura 32 Entorno del IDE Netbeans
Modularidad. Todas las funciones del IDE son provistas por módulos. Cada módulo
provee una función bien definida, tales como el soporte de Java, edición, o soporte
para el sistema de control de versiones. NetBeans contiene todos los módulos
necesarios para el desarrollo de aplicaciones Java en una sola descarga,
permitiéndole al usuario comenzar a trabajar inmediatamente.
– UNAD
JCreator: JCreator es una herramienta de desarrollo para JAVA. Es rápido,

eficiente y confiable. Es la herramienta perfecta para los programadores de todos
los niveles
Figura 33 Entorno del IDE JCreator
Figura 34 Pestañas y resaltado de sintaxis en JCreator
JCreator posee una amplia gama de funcionalidades, tales como:

 Gestión de proyectos
 Plantillas de proyecto
 Finalización de código
– UNAD
 interfaz de depuración
 Editor con resaltado de sintaxis
 Asistentes
 Interfaz de usuario totalmente personalizable
Con JCreator es posible compilar o ejecutar directamente el programa Java sin
necesidad de activar el documento principal. JCreator identifica automáticamente el
archivo con el método principal o el archivo html cargador del applet de Java.
Para el desarrollo de las actividades prácticas del presente curso se recomienda el
empleo de JCreator (versión LE).
Para realizar la instalación del JCreator es necesario descargarlo desde la página
http://www.jcreator.org/download.htm, allí deberá seleccionar el instalador
correspondiente a su sistema operativo y hacer clic en el enlace de descarga.
Figura 35 Descarga del Instalador de JCreator
Lección 20 Compilación y ejecución

Empleando el IDE JCreator se tiene acceso a las herramientas de compilación y
ejecución de un programa en JAVA, a continuación se presenta la ubicación de
dichas herramientas en el entorno del IDE:
20.1 Compilación
Al emplear la herramienta de compilación, JCreator hace el llamado al compilador
de JAVA ejecutando el programa javac.exe.
– UNAD
Figura 36 Acceso a la herramienta de compilación en JCreator
En caso de presentarse errores durante la compilación, el recuadro de la derecha

presentará el mensaje de error generado indicando el número de fila
correspondiente. Si el programa es compilado efectivamente, el recuadro enunciará
“Process completed”.
20.2 Ejecución
Una vez compilado el programa en JAVA, se genera un nuevo archivo en el
directorio srcinal con la extensión .class, el cual puede ser interpretado ejecutando
el programa java.exe.
Figura 37 Acceso a la herramienta de ejecución en JCreator
Los mensajes de salida producidos por la ejecución del programa serán

visualizados en el recuadro de la derecha (General output).
– UNAD
CAPÍTULO 5 Algoritmos básicos

En este capítulo se revisan los fundamentos geométricos y matemáticos a partir de
los cuales se generan los algoritmos que dibujan primitivas gráficas como líneas,
circunferencias y arcos. Para su desarrollo se utilizó el capítulo correspondiente del
texto de Claudio Delrieux y se complementa con la codificación en Java de los
algoritmos.
Es muy difícil escoger un conjunto de primitivas gráficas que sea adecuado para la
representación de todo tipo de entidades gráficas. Sin embargo, el siguiente
subconjunto resulta suficiente en la práctica:
Puntos: Se especifican a partir de su localización y color. Su discretización es
directa, como se mencionó con anterioridad.
Segmentos de recta: Son esenciales para la mayor parte de las entidades. Se
especifican a partir de un par de puntos que representan sus extremos.
Circunferencias: En algunos casos representar entidades curvadas con
segmentos poligonales puede ser inadecuado o costoso, por lo que en la prácticas
las circunferencias o círculos se adoptan como primitivas. Se especifican con la
posición de su centro y su radio.
Polígonos: Son indispensables para representar entidades sólidas. Se representan
a partir de la secuencia de puntos que determina la poligonal de su perímetro .
Lección 21 Especificación de una discretización

En el momento de escoger un método de discretización para una primitiva gráfica,
es indispensable contar con criterios que permitan evaluar y comparar las ventajas
y desventajas de las distintas alternativas. Entre todas las especificaciones
posibles, podemos mencionar las siguientes:
Apariencia: Es la especificación más obvia, aunque no es fácil describirla en
términos formales. Normalmente se espera que un segmento de recta tenga una
“apariencia recta” más allá de que se hallan escogido los pixels matemáticamente
más adecuados. Tampoco debe tener discontinuidades. Debe pasar por la
discretización del primer y último punto del segmento. Debe ser uniforme, etc.
Simetría e invariancia geométrica : Esta especificación se refiere a que un
método de discretización debe producir resultados equivalentes si se modifican
algunas propiedades geométricas de la primitiva que se está discretizando. Por
– UNAD
ejemplo, la discretización de un segmento no debe variar si dicho segmento se

traslada a otra localización en el espacio, o si es rotado, etc.
Simplicidad y velocidad de cómputo : Como los métodos tradicionales de
discretización de primitivas se desarrollaron hace tres décadas, en momentos en
que las posibilidades del hardware y software eran muy limitadas, los resultados
eran muy sensibles al uso de memoria u operaciones aritméticas complejas. Por lo
tanto, los métodos tienden a no depender de estructuras complejas y a ser
directamente implementables en hardware específico de baja complejidad.
21.1 Métodos de discretización

Dada una primitiva gráfica a discretizar, debemos encontrar los pixeles que la
representen de la manera más correcta posible. Para ello, lo más adecuado es
caracterizar matemáticamente a dicha primitiva, de modo que su discretización
pueda efectuarse en forma sencilla. Entre los diversos métodos que pueden
plantearse destacamos los dos siguientes:
Evaluar su ecuación
DDA (discrete diferencediferencial
analyzer) a diferencias
consiste : Este
finitasla
en plantear método,
ecuación denominado
diferencial de la
primitiva a discretizar, y luego evaluar dicha expresión a intervalos adecuados.
Análisis del error: Estos métodos fueron desarrollados por Bressenham y se
basan en analizar, dado un pixel que pertenece a la discretización de la primitiva,
cuál es el próximo pixel que minimiza una determinada expresión que evalúa el
error que comete la discretización.
Lección 22 Segmentos de recta

El análisis de los métodos de discretización de rectas parte de considerar el
comportamiento esperado en determinados casos particulares. Dichos casos
surgen de suposiciones específicas que simplifican el problema, pero que al mismo
tiempo se pueden generalizar a todos los demás casos por medio de simetrías.
Dado un segmento de recta que va de (x0; y0) a (x1; y1), se supone que:
 x = (x1 - x0 )  0,
 y = (y1 - y0 )  0, y
 x  y.
– UNAD
antalla sombreado en la
Esto equivale a trabajar en el “octavo” del espacio de p
Figura 38, donde el srcen es el pixel que corresponde a la discretización del punto
(x0;y0) y la zona sombreada a los lugares donde puede ubicarse el punto (x1;y1 ).
Figura 38 Espacio designado para caracterizar la discretización de rectas
22.1 Segmentos de recta DDA

Como ya se mencionó, los métodos DDA evalúan la ecuación diferencial de la
primitiva a intervalos finitos. En el caso particular de los segmentos de recta, la
ecuación diferencial es:
El método busca encontrar una secuencia de n + 1 puntos tales que (x0;y0) =

(x0;y0); (x1;y1); … (xn;yn) = (x1;y1). La discretización de cada uno de ellos son los
pixeles de la discretización del segmento. Esta propiedad, si bien es trivial, es de
gran importancia porque determina que la discretización de un segmento de recta
es invariante frente a transformaciones afines. Esto significa que es equivalente
transformar los extremos del segmento y discretizar el segmento transformado, o
discretizar primero y transformar cada punto obtenido. Sin embargo, la primera
alternativa es mucho más eficiente.
Dada la ecuación diferencial y un incremento finito arbitrario , podemos

pasar de un pixel dado de la secuencia al siguiente por medio de la expresión
 determina la “frecuencia” de muestreo del segmento. Un valor muy pequeño

determina que muchas muestras producirán puntos que serán discretizados al
– UNAD
mismo pixel. Por el contrario, un valor muy grande determinaría que el segmento
aparezca “punteado” en vez de ser continuo como corresponde. Un valor práctico
es elegir x = 1 y por lo tanto n = x, es decir, la discretización tiene tantos pixeles
como longitud tiene el segmento en la variable que más varía (más uno, dado que
la secuencia tiene n + 1 puntos). Al mismo tiempo es fácil ver que
En la Figura 39 es posible ver el resultado de discretizar un segmento particular por

el método DDA. Observese que los puntos extremos (x0; y0) a (x1;y1) son en
efecto puntos y por lo tanto están ubicados en cualquier lugar dentro del pixel que
corresponde a su discretización.
Figura 39 Discretización de un segmento de recta con DDA
Un algoritmo sencillo escrito en lenguaje Java que computa la discretización de un

segmento de recta por el método DDA se muestra en la Figura 40. Obsérvese que
se computan las variables en punto flotante, y que además se requiere una división
en punto flotante que corresponde al cálculo de m.
Un pequeño paréntesis para explicar algunas sentencias que pueden causar
dudas:
1. Sobre el parámetro Graphics g (línea 26), corresponde al contexto gráfico
de la ventana (algo así como un lienzo) sobre el cual se dibuja.
2. La llamada al método setColor (línea 34) permite modificar el color actual
con el cual se está dibujando, se toma el color como un objeto de tipo Color
que puede ser de los preterminados de Java o creado a partir de los
parámetros r, g, b. Esta llamada al método setColor permite modificar el
color del “lápiz” que dibuja sobre el contexto gráfico.
– UNAD
Figura 40 Codificación en Java del algoritmo DDA de dibujo de líneas
3. Java no tiene una sentencia básica para dibujar puntos (pixeles), en este
caso se utiliza la sentencia g.drawRect (línea 35) para dibujar un rectángulo
con un ancho y alto de 0, que en su ejecución se traduce a pintar un único
pixel ubicado en el punto enviado como parámetro.
4. En la misma sentencia g.drawRect (línea 35) se utiliza el “casting” a enteros
para lograr la discretización de las coordenadas flotantes.
La ejecución del algoritmo daría como resultado algo similar a lo mostrado en la

Figura 41 para 3 líneas diferentes.
Para poder discretizar un segmento de recta
en cualquiera de las posibilidades es
necesario considerar las simetrías que se
aplican. Si por ejemplo no se cumple que y =
(y1 - y0)  0, entonces hay que considerar
pendientes negativas (simetría A), caso que el
algoritmo de la Figura 40 realiza
automáticamente.
En cambio, si x = (x1 - x0 )  0, entonces es
necesario decrementar a x en el ciclo e iterar
Figura 41 Ejecución del algoritmo DDA mientras no sea menor que x1 (simetría B).
en Java
Por último, si no se cumple que x  y, entonces es necesario intercambiar los

roles de las variables x e y (simetría C). Cualquier combinación de situaciones se
puede resolver con combinaciones de simetrías (ver Figura 42).
– UNAD
Figura 42 Simetrías para discretizar segmentos de recta
22.2 Segmentos de rectas por Bressenham

En el algoritmo DDA para segmentos de recta es necesario computar sumas entre
las variables en punto flotante, y además se requiere una división en punto flotante
para computar la pendiente. El mérito del algoritmo que vamos a presentar consiste
en que todas las operaciones se realizan en aritmética entera por medio de
operaciones sencillas, y por lo tanto, su ejecución es más rápida y económica, y es
de fácil implementación con hardware específico.
El punto de partida del análisis es el siguiente. Si la discretización de los puntos
extremos del segmento debe pertenecer a la discretización del segmento, entonces
es conveniente efectuar la llamada al algoritmo luego de discretizar los extremos.
Esto significa que (x0; y0) y (x1; y1),y por lo tanto x y y son enteros.
Luego, si p es un pixel que pertenece a
la discretización del segmento,
entonces en las condiciones
particulares mencionadas, el próximo
pixel solamente puede ser el ubicado a
la derecha (E o “hacia el este”), o el
ubicado en diagonal hacia la derecha y
hacia abajo (D o “en diagonal”) como se
Figura 43 Si p pertenece a la discretización el
muestra en la Figura 43.
próximo punto será E o D
La decisión de ir hacia el paso E o D se toma en función del error que se comete en

cada caso. En este algoritmo se considera que el error es la distancia entre el
– UNAD
centro del pixel elegido y el segmento de recta, medida en dirección del eje Y
positivo del espacio de pantalla (es decir, hacia abajo). Si el error en p fuese cero,
entonces al ir hacia E el error pasa a ser m (la pendiente del segmento), y en D el
error pasa a ser m - 1 (ver Figura 44).
Figura 44 Error al desplazarse en E Figura 45 Elección del próximo pixel
En general, si en p el error es e, la actualización del error es:
 Paso a E : e = e + m
 Paso a D : e = e + m –1
Por lo tanto, la elección del paso E o D depende de que el valor absoluto de e+m
sea o no menor que el valor absoluto de e+m-1. Expresado de otra manera, sea e
el error en un determinado pixel. Si e +m> 0.5 entonces el segmento de recta pasa
más cerca del pixel D, y si no, pasa más cerca del pixel E (ver Figura 45).
Una de las economías de cómputo del método proviene de poder evaluar el error
preguntando por cero. Es fácil ver que si se inicializa el error en e = m – 0.5
entonces en cada paso hay que chequear e >0 para elegir D. La otra economía
proviene de realizar manipulaciones algebraicas para efectuar un cómputo
equivalente pero en aritmética entera. Como se evalúa el error por cero, multiplicar
el error por una constante no afecta el resultado. Por lo tanto, multiplicamos el error
por 2x. A partir de dicho cambio, se constatan las siguientes igualdades:
 y 
e0  2x  0.5   2y  x
 x 
 Paso a E : e = e+2 y
 Paso a D: e = e+2( y-x)
– UNAD
De esta manera todas las operaciones se efectúan en aritmética entera, con su

correspondiente agilización del tiempo de procesamiento.
Figura 46 Algoritmo de Bressenham para segmentos de recta
La implementación del algoritmo de Bressenham para segmentos de recta se

muestra en la Figura 46. Teniendo en cuenta que los productos por 2 en aritmética
entera se efectúan con un desplazamiento a izquierda, es posible observar que el
mismo utiliza operaciones elementales e implementables con hardware específico
muy sencillo.
Lección 23 Discretización de circunferencias

Como en el caso de los segmentos de recta, en la discretización de circunferencias
o círculos es posible trabajar un sólo segmento de la circunferencia y se obtienen
las demás por simetría. Igualmente se dispone de algoritmos DDA y de
Bressenham para el dibujo de circunferencias. En este aparte se mostrará una
adaptación del algoritmo DDA a partir de la ecuación de la circunferencia, tomado
de la página internet de Roberto Albornoz.
Para poder realizar el dibujo de la circunferencia usaremos las ecuaciones de la
circunferencia en coordenadas polares que son:
x  r * cos 
y  r * sen
– UNAD
Estas ecuaciones serán las que ocuparemos para calcular cada punto (x,y) del
círculo, donde el r será obviamente el radio de círculo y  será el ángulo que forma
el radio con la parte positiva del eje x. En forma gráfica sería así:
Figura 47 Circunferencia con coordenadas polares
El ángulo deberá estar en radianes ya que las funciones de seno y coseno que
incluye Java, trabajan con los ángulos en radianes. La fórmula para transformar
grados a radianes es la siguiente:
gra dos * 
radianes  180
Entonces para dibujar el círculo de un radio determinado, solamente tenemos que

hacer un ciclo desde 0 hasta 360, pero con incrementos pequeños, calcular cada
punto con las ecuaciones en coordenadas polares e ir dibujando cada punto. El
ciclo en vez de ir de 0 a 360 (ángulos en grados) irá de 0 a 6.28
(360*3.14/180=6.28) ya que el ángulo debe estar en radianes.
Como dijimos el ciclo de 0 a 6.28 debe hacerse con incrementos pequeños, no
contando de uno en uno, ya que para un círculo de radio muy grande, podrían
aparecer huecos entre un punto y el siguiente, por lo tanto tenemos que usar un
incremento fraccionario. El valor 0.005 produce buenos resultados. Dibujar el
círculopunto
cada puntoelaseno
puntoy el
escoseno
una tarea
delun poco lenta,
ángulo, y estasdebido a queson
funcionas se muy
debelentas.
calcular en
Para
solucionar esto se pueden crear tablas predefinidas o pre-calculadas. En la
siguiente figura se muestra el código en Java que permitiría dibujar el círculo en
una ventana.
– UNAD
Figura 48 Código en Java para el dibujo de circunferencias
Nótese que al calcular las

coordenadas x e y, estamos
sumándoles las coordenadas cx e
cy. Esto se hace para trasladar el
centro del círculo a cualquier punto
que queramos. De esta forma,
para dibujar un círculo solamente
es necesario especificar las
coordenadas del centro (cx, cy), el
radio, el color del círculo y el
contexto gráfico.
Figura 49 Resultado de la ejecución del algoritmo
dibujo de circunferencias
Lección 24 Dibujo de polígonos

Se considera un polígono una figura cerrada, formada a partir de varias líneas.
Para la discretización de polígonos se considerarán 2 tipos de polígonos: los
irregulares y los regulares, en concordancia con lo mostrado por Steven R
Davidson en su curso de gráficos disponible en internet.
24.1 Polígonos irregulares

La graficación de polígonos irregulares se realiza a partir de un conjunto de puntos
que se unen secuencialmente, el polígono se cierra al unir el primer y último
puntos. A continuación se muestra el código Java que dibujaría un polígono
irregular a partir de un vector de elementos de tipo Punto y el correspondiente
número de puntos.
– UNAD
Figura 50 Código en java para el dibujo de polígonos
Cabe
en C, recordar
el índice que en vectores
de los Java, al igual
iniciaque
en
0. Por tanto, la primera línea se dibuja
desde el primer punto (índice 0) hasta el
segundo punto (índice 1), continúa del
segundo al tercero (índice 2) y así
sucesivamente, hasta dibujar la línea
del penúltimo punto (índice N-2) hasta
el último punto del vector (índice N-1).
Al finalizar el ciclo, dibuja la línea de
cierre del polígono entre el último punto
Figura 51 Resultado de la ejecución del (índice N-1) y el primero (índice 0).
algoritmo de dibujo de Polígonos
Como se podrá deducir del código el objeto Punto incluye las coordenadas x e y de
un punto en el plano cartesiano.
24.2 Polígonos regulares

Un polígono regular se compone de aristas/lados de igual longitud. Esto implica
que el ángulo entre cada arista contigua es el mismo. Si trazamos un segmento del
centro a un vértice y otro segmento del centro a otro vértice contiguo, entonces el
ángulo entre estos dos segmentos es un divisor de 2π = 360°. En otras palabras,
cada ángulo mencionado es inversamente proporcional a la cantidad de lados del
polígono regular. Podemos usar la siguiente fórmula:
 α = 2π / N, donde α es el ángulo, y N es la cantidad de lados
Crearemos polígonos regulares en base a una circunferencia que circunscribe

nuestro polígono regular. Esto implica, que el centro de la circunferencia coincide
con el centro geométrico de cualquier polígono regular. Para esto, necesitamos
usar algunas funciones trigonométricas, junto con el ángulo ya calculado. El paso
– UNAD
principal es averiguar la coordenada del siguiente vértice de nuestro polígono.

Usaremos las siguientes fórmulas:
 x i = cx + r * cos( i* α )
 y i = cy + r * sen( i* α )
donde:
 i = 0,1,2,...,N-1,
 r es el radio de la circunferencia, y
 c = (cx, cy) es la coordenada del centro geométrico de la circunferencia y del
polígono.
Al agregar el centro a nuestra fórmula, conseguimos mover el centro geométrico
del srcen (0,0) al que nosotros deseemos. En la Figura 52 se muestra el código
que generaría los polígonos regulares.
Figura 52 Código en java para dibujar polígonos regulares
Los parámetros de entra para el método especifican el número de lados del

polígono (N), el punto centro de la circunferencia (centro), el radio de la
circunferencia (radio), el contexto gráfico (g) y el color.
– UNAD
Observe que es necesario hacer un

proceso de conversión a entero del dato
resultante en la multiplicación del coseno
del ángulo por el radio (líneas 46 y 47),
ya que las coordenadas de los puntos se
deben expresar como datos enteros. Los
datos así calculados se utilizan en la
conformación de cada vértice del
polígono (línea 48). Finalmente, una vez
obtenidas las coordenadas de todos los
vértices del polígono se realiza la llamada
al proceso de dibujarPolígonos explicado
en la sección anterior (línea 50). Figura 53 Resultado de la ejecución del
algoritmo para dibujar polígonos regulares
Lección 25 Llenado de áreas

Si bien existen diversos métodos, aquí presentaremos el más económico y
difundido, que se basa en encontrar la intersección de todos los lados del polígono
con cada línea de barrido (a y constante), por lo que el método se denomina
conversión scan del polígono. Este método es de gran importancia porque se
generaliza a una clase de algoritmos denominados scan-line para resolver
determinados problemas de iluminación y sombreado en tres dimensiones.
Todo polígono plano puede descomponerse en triángulos. Por lo tanto el triángulo
será la base del análisis de la conversión scan de polígonos en general. Para
computarla es necesario dimensionar dos arreglos auxiliares de enteros minx,
maxx que para cada línea de barrido almacenarán el menor y mayor x
respectivamente.
– UNAD
Figura 54 Dibujo scan de un polígono
1. Inicializar minx a infinito y maxx a menos infinito.

2. Discretizar cada arista del triángulo (con DDA o Bressenham) reemplazando
la sentencia de dibujado por

if (x>maxx[y]) maxx[y]=x;
if (x<minx[y]) minx[y]=x;

3. Para cada y activo, graficar una línea de minx[y] a maxx[y].
CAPÍTULO 6 Transformaciones
Naturalmente, así como se desean dibujar gráficos, también se desea moverlos,
rotarlos, cambiar su tamaño, etc. En esta sección se presentan los principales
fundamentos matemáticos que subyacen al proceso de transformación de los
gráficos en dos dimensiones, a partir de lo mostrado por el euitmt WWW team de la
Universidad de Oviedo. Se espera que el estudiante en su proceso de
profundización realice los algoritmos que permitan hacer estas transformaciones.
Una de las mayores virtudes de los gráficos generados por ordenador es la
facilidad con se pueden realizar algunas modificaciones sobre las imágenes. Un
gerente puede cambiar la escala de las gráficas de un informe. Un arquitecto puede
ver un edificio desde distintos puntos de vista. Un cartógrafo puede cambiar la
escala de un mapa. Un animador puede modificar la posición de un personaje.
Estos cambios son fáciles de realizar porque la imagen gráfica ha sido codificada
en forma de números y almacenada en el interior del ordenador. Los números son
susceptibles a las operaciones matemáticas denominadas transformaciones.
– UNAD
Las transformaciones permiten alterar de una forma uniforme toda la imagen. Es un

hecho que a veces es más fácil modificar toda la imagen que una porción de ella.
Esto supone un complemento muy útil para las técnicas de dibujo manual, donde
es normalmente más fácil modificar una pequeña porción del dibujo que crear un
dibujo completamente nuevo.
Es esta sección se verán transformaciones geométricas como el cambio de
escala, la traslación y la rotación , como se expresan de una forma sencilla
mediante multiplicaciones de matrices y se introducirán las coordenadas
homogéneas con el fin de tratar de una manera uniforme las transformaciones y
como anticipo de las transformaciones producidas por la perspectiva en los
modelos tridimensionales.
Lección 26 Breve repaso sobre matrices

Las imágenes gráficas que se han generado están compuestas por un conjunto de
segmentos que están representados por las coordenadas de sus extremos.
Algunos cambios en la imagen pueden ser fácilmente realizados mediante la
aplicación de algunas operaciones matemáticas sobre estas coordenadas. Antes
de ver algunas de las posibles transformaciones, es necesario repasar algunas de
las herramientas matemáticas que se necesitarán, como la multiplicación de
matrices.
Para nuestro propósito, consideraremos que una matriz es un conjunto n-
dimensional de números, por ejemplo:
son cuatro matrices diferentes.

Supongamos que se define la matriz A como:
Entonces el elemento situado en la segundo fila y la tercera columna será A[2][3] y

tendrá un valor de 6.
– UNAD
La operación matricial que más se empleará será la multiplicación de matrices. La

multiplicación de matrices es algo más complicada que la simple multiplicación de
dos números; supone varios productos sencillos y sumas de los elementos de la
matriz. No todas las parejas de matrices pueden ser multiplicadas. Se pueden
multiplicar dos matrices A y B si el número de columnas de la primera matriz
A es igual al número de filas de la segunda matriz B . Por ejemplo, si
escogemos como matriz A la última que hemos visto y como matriz B la siguiente:
Entonces podemos multiplicar A por B porque la primera tiene tres columnas y la

segunda tres filas. Al contrario que la multiplicación de números, la multiplicación
de matrices no es conmutativa, es decir, aunque podemos multiplicar A por B no
podemos multiplicar B por A, por que B tiene sólo dos columnas que no se
corresponden con las tres filas de A. Cuando multiplicamos dos matrices se
obtiene como resultado otra matriz . Esta matriz producto tendrá el mismo
número de filas que la primera de las matrices que se multiplican y el mismo
número de columnas que la segunda, es decir, a partir del ejemplo, la multiplicación
de la matriz A3x3 con la matriz B3x2 da como resultado la matriz C3x2.
Los elementos de la matriz producto C se expresan en función de los elementos de
las matrices A por B mediante la siguiente fórmula:
En nuestro caso particular de C = A B
La multiplicación de matrices es una operación asociativa. Esto significa que si

tenemos varias matrices para multiplicar a la vez, no importa cuales multipliquemos
primero. De forma matemática: A(BC) = (AB) C
Esta es una propiedad muy útil ya que permitirá combinas varias transformaciones
gráficas en una sola transformación, produciendo como resultado unos cálculos
más eficientes.
– UNAD
Existe un conjunto de matrices que cuando multiplican a otra matriz, la reproducen.

Por esta razón reciben el nombre de matrices identidad. Son matrices cuadradas
(tienen el mismo número de columnas y de filas) con todos los elementos 0 excepto
los elementos de la diagonal principal, que valen todos 1. Por ejemplo
De forma matemática A = AI
Lección 27 Cambios de escala

¿Cómo se aplica todo esto a los gráficos? Bueno, consideremos un punto P1=[x1
y1] como una matriz de 1x2. Si la multiplicamos por una matriz T2x2, obtendremos
otra matriz que puede ser interpretada como otro punto.
Por tanto, la matriz T es una aplicación entre el punto srcinal P1 y el nuevo punto
P2. Si suponemos la imagen compuesta por los vértices de un polígono. ¿Qué
pasará si transformamos cada uno de los puntos mediante una multiplicación por
una matriz T y dibujamos el resultado? ¿Qué aspecto tendrá esta nueva imagen?
La respuesta, por supuesto, depende de los elementos de la matriz T. Si, por
ejemplo, escogemos la matriz identidad entonces la imagen no se verá alterada.
Sin embargo, si escogemos la matriz
entonces
Cada una de las nuevas coordenadas x tiene el doble de valor que las antiguas.
Las líneas horizontales serán dos veces más largas en la nueva imagen. La nueva
imagen tendrá la misma altura, pero parecerá que la hemos estirado hasta alcanzar
el doble del ancho srcinal.
– UNAD
antes de la transformación después de la transformación
En general, las transformaciones de la forma
Cambian el tamaño y la proporción de la imagen. Se denominan transformaciones

de escalado. Ex es el factor de escala para la coordenada x y Ey es de la
coordenada y.
Lección 28 Rotación
La siguiente transformación gráfica que vamos a ver es la rotación. Para introducir
esta transformación recordaremos brevemente algunos conceptos trigonométricos.
Sea un punto p1=(x1, y1) y lo giramos alrededor del srcen un ángulo  para pasar
a una nueva posición p2=(x2, y2). Queremos encontrar la transformación que
convierte (x1, y1) en (x2, y2). Pero, antes de comprobar si alguna transformación
es la adecuada, debemos saber primero que (x2, y2) debe escribirse en función de
(x1, y1) y . Para esto es necesario recordar las razones trigonométricas de seno y
coseno.
– UNAD
A la vista de esta figura sabemos que
Es importante señalar que cuando la longitud del segmento es la unidad
También emplearemos las siguientes relaciones trigonométricas para determinar

como gira un punto:
Ahora estamos listos ya para determinar la rotación de un punto alrededor del

srcen.
A la vista de esta figura tenemos:
Donde L es la distancia del punto al srcen de coordenadas. Por otro lado:
Que nos lleva a
De forma análoga:
– UNAD
Dando
A la vista de estas ecuaciones podemos imaginar una matriz que relacione las
coordenadas del punto srcinal y del punto girado:
Así la matriz de transformación para una rotación en sentido contrario a las agujas
del reloj de ángulo alrededor del srcen es
Para una rotación en el sentido de las agujas del reloj, basta sustituir en la
expresión anterior el valor del ángulo por - . Así nos queda
Lección 29 Coordenadas homogéneas y traslación

Supongamos que necesitamos realizar un giro alrededor de un punto que no es el
srcen. Si fuésemos capaces de trasladar toda la imagen de un punto a otro de la
pantalla, podríamos realizar este giro moviendo primero la imagen hasta que el
centro de rotación coincida con el srcen, luego realizamos la rotación y, por último,
devolvemos la imagen a su posición srcinal.
Desplazar la imagen recibe el nombre de traslación. Se realiza de una forma
sencilla mediante la suma a cada punto de la cantidad que vamos a mover la
imagen.
En general, con el fin de trasladar un imagen (Tx, Ty), cada punto (x1, y1) se
convierte en uno nuevo (x2, y2) donde
– UNAD
Desafortunadamente, esta forma de describir la traslación no hace uso de matrices,

por lo tanto no podría ser combinada con las otras transformaciones mediante una
simple multiplicación de matrices.
Tal combinación sería deseable; por ejemplo, hemos visto que la rotación alrededor
de un punto que no sea el srcen puede realizarse mediante una traslación, una
rotación u otra traslación. Sería deseable combinar estas tres transformaciones en
una sola transformación por motivos de eficacia y elegancia. Una forma de hacer
esto es emplear matrices 3x3 en vez de matrices 2x2, introduciendo una
coordenada auxiliar w. Este método recibe el nombre de coordenadas
homogéneas. En estas coordenadas, los puntos están definidos por tres
coordenadas y no por dos. Así un punto (x, y) estará representado por la tripleta
(xw, yw, w). Las coordenadas x e y se pueden recuperar fácilmente dividiendo los
dos primeros números por el tercero respectivamente. No emplearemos la
coordenada w hasta que no veamos las transformaciones tridimensionales de
perspectiva. En dos dimensiones su valor suele ser 1 para simplificar. Sin embargo,
lo veremos de forma general como anticipo de las transformaciones
tridimensionales.
En coordenadas homogéneas la matriz de cambio de escala
se convierte en
Si aplicamos esta matriz a un punto (xw, yw, w) obtenemos
Si dividimos
cambiado deahora por el tercer valor w tenemos (Exx, Eyy) que es el punto correcto
escala.
En el caso de la matriz de rotación en sentido anti-horario
Se convierte, usando coordenadas homogéneas, en:

– UNAD
Si aplicamos esta matriz a un punto (xw, yw, w) obtenemos
Para dar el punto correctamente rotado

La matriz de transformación para una traslación Tx, Ty en coordenadas
homogéneas es
Para comprobar que esto es así apliquemos la matriz a un punto genérico
Que nos da el punto trasladado
Lección 30 Rotación alrededor de un punto

Determinemos ahora la matriz de transformación para la rotación en sentido
antihorario alrededor del punto (xC, yC).
Haremos esta transformación en tres pasos. Primero trasladaremos el punto (xC,
yC) al srcen, luego haremos la rotación alrededor del srcen y, por último,
devolveremos el centro de rotación a su posición srcinal.
La traslación que desplaza al punto (xC, yC) al srcen es
– UNAD
La rotación es
Y la traslación que devuelve al centro de rotación a su posición es

Para transformar un punto podemos realizar la siguiente multiplicación
Pero, teniendo en cuenta la propiedad asociativa de la multiplicación de matrices,

podemos multiplicar todas las transformaciones primero para obtener la matriz
global de transformación
Cabe destacar que esta matriz se puede formar también mediante una rotación
inicial de ángulo  y una traslación definida por los valores contenidos en la tercera
fila.
30.1 Otras transformaciones

Las tres transformaciones de cambio de escala, rotación y traslación son las más
útiles y las más usadas. Son también posibles otras transformaciones. Dado que
una matriz 2x2 cualquiera
– UNAD
Puede convertirse en una matriz 3x3 en coordenadas homogéneas como
Algunas de estas transformaciones como matrices 2x2:
-1 0
0 1
Reflexión respecto al eje y
1 0
0 -1
Reflexión respecto al eje x
-1 0
0 -1
Reflexión respecto al srcen
0 1
1 0
Reflexión respecto a la recta y=x
0 -1
-1 0
Reflexión respecto a la recta y=-x
1 a
0 1
Deformación en el eje y
1 0
b 1
Deformación en el eje x
Las primeras tres reflexiones son simples cambios de escala pero con factores
negativos. Las simetrías respecto a las rectas y=x e y=-x pueden realizarse
mediante un cambio de escale y un giro posterior. Es posible realizar las
deformaciones mediante una secuencia de rotaciones y cambios de escala, aunque
es mucho más fácil aplicar la matriz resultante. De igual forma se pueden construir
transformaciones de cambio de escala y rotación a partir de las deformaciones.
– UNAD

ALBORNOZ Roberto. Programación gráfica en lenguaje C. [En línea]
http://www.geocities.com/programacion_grafica/prog_graf.htm
Fecha de consulta: Septiembre de 2005.
DAVIDSON, Steven. Curso de gráficos con clase. [En línea]
http://graficos.conclase.net/curso/index.php
Fecha de consulta: Diciembre de 2005. steven@conclase.net
DELRIEUX, Claudio. Introducción a la computación gráfica. [En línea]
http://www.dc.uba.ar/people/materias/cgr/util.htm. Universidad Nacional del Sur.
Departamento de Ingeniería eléctrica. Claudio@acm.org.
EUITMT WWW TEAM. Dibujo asistido por ordenador. Transformaciones 2 y 3 D.
[En línea] http://www.mieres.uniovi.es/egi/dao/apuntes/. Universidad de Oviedo.
Campus Mieres. Fecha de consulta: Octubre de 2005. Última modificación: 9 de
Julio de 1999 - 13:36:26
– UNAD
UNIDAD 3 TRABAJANDO CON UN API GRÁFICA

Introducción
En los capítulos anteriores nos hemos acercado al mundo de la computación
gráfica conociendo sus bases conceptuales y haciendo pequeños programas que
permiten dibujar en la pantalla a partir de la unidad básica de dibujo: el píxel. En
esta Unidad en
mencionaba deseamos
la primera introducir
unidad lasel manejo de una
API gráficas API gráfico.
proporcionan Como de
un conjunto se
primitivas independientes del hardware que le facilitan el proceso de dibujo
computacional, algunas de ellas, como OpenGL son muy utilizadas por dos
razones: su potencial y la libre distribución.
El lenguaje de programación Java proporciona como parte de su conjunto de
clases fundamentales para la creación de interfaces gráficas de usuario, un
conjunto de clases denominado Java 2D.
El API 2D de Java introducido en el JDK 1.2 proporciona gráficos avanzados en
dos dimensiones, texto, y capacidades de manejo de imágenes para los programas
Java a través de la extensión del AWT. Este paquete de dibujo soporta líneas
artísticas, texto e imágenes en un marco de trabajo flexible y lleno de potencia para
desarrollar interfaces de usuario, programas de dibujo sofisticados y editores de
imágenes.
El API 2D de Java proporciona:
 Un modelo de renderizado uniforme para pantallas e impresoras.

 Un amplio conjunto de gráficos primitivos geométricos, como curvas,
rectángulos, y elipses y un mecanismo para renderizar virtualmente
cualquier forma geométrica.
 Mecanismos para detectar esquinas de formas, texto e imágenes.
 Un modelo de composición que proporciona control sobre cómo se
renderizan los objetos solapados.
 Soporte de color mejorado que facilita su manejo.
 Soporte para imprimir documentos complejos.
Durante el primer capítulo de esta Unidad didáctica se cubrirán los tópicos
correspondientes a la graficación en 2D mediante el uso del API 2D de Java, a
partir de la recopilación de dos documentos de internet que son magníficos puntos
de referencia: El tutorial sobre gráficos en Java de Agustín Froufe y el curso de
Java en Castellano traducido por Juan Antonio Palos (ozito).
– UNAD
En cuanto al dibujo (o renderizado) en 3D, El API Java 3D es un interface para

escribir programas que muestran e interactúan con gráficos tridimensionales. Java
3D es una extensión estándar del JDK 2 de Java. El API Java 3D proporciona una
colección de constructores de alto-nivel para crear y manipular geometrías 3D y
estructuras para dibujar esta geometría. Java 3D proporciona las funciones para
creación de imágenes, visualizaciones, animaciones y programas de aplicaciones
gráficas 3D interactivas. En el segundo capítulo de esta Unidad se proporcionan los
elementos fundamentales para asumir el estudio del API Java 3D, proporcionando
algunos ejemplos básicos. Para el desarrollo de esta parte de la Unidad se ha
recopilado nuevamente la información proporcionada por Juan Antonio Palos
(ozito).
Esta unidad final del curso de Computación Gráfica quiere acercarlo aún más a la
visualización de gráficos computacionales. Aunque se reconoce que la información
que se proporciona es bastante limitada, los límites se los impone su creatividad y
sus deseos de realizar nuevas cosas. En la sección de Enlaces relacionados podrá
encontrar enlaces con una gran cantidad de información adicional, para ayudarlo a
hacer volar su imaginación.
La implementación
anticipación de buena parte
los fundamentos de los
básicos de ejemplos requiere
la clase Awt que usted
o Swing conozca
de Java, con
si quiere
repasarlos, revise la sección de enlaces.
Propósitos
Introducir al estudiante en el conocimiento de los principales algoritmos y
estructuras de datos utilizados en Computación Gráfica, especialmente en la
generación de gráficos en dos dimensiones.
Proporcionar al API
permitan utilizar estudiante
gráficas los lineamientos
en conjunto tecnológicos
con lenguajes básicos que de
de programación le
alto nivel, para el proceso de modelamiento y construcción de escenarios
gráficos en 2D y 3D.
Objetivos
Programar ejercicios de llenado de áreas y transformaciones de figuras en
dos dimensiones, utilizando librerías gráficas y lenguajes de programación,
partiendo de la conceptualización geométrica respectiva.
– UNAD
Emplear los fundamentos necesarios para la construcción de aplicaciones

que presenten objetos gráficos en dos dimensiones, mediante la
funcionalidad que proporciona el paradigma orientado a objetos y el API
Java 2D.
Identificar algunas de las potencialidades para el dibujo y animación de
escenarios gráficos en tres dimensiones, a partir de la programación de
ejemplos básicos que utilizan el API Java 3D.
Competencias
El estudiante programa y emplea algoritmos que permiten dibujar las
principales figuras geométricas en dos dimensiones.
El estudiante conoce los fundamentos matemáticos de la representación de
gráficos computacionales en dos dimensiones y utiliza algoritmos que las
realizan.
El estudiante utiliza las principales clases proporcionadas por el API 2D y 3D
de Java, en la programación de ejercicios que exigen la representación de
gráficos en dos y tres dimensiones.
Metas
 Usar API gráficas para la construcción de gráficos computacionales.
 Utilizar y construir algoritmos para dibujo de gráficos en 2D y 3D.
 Describir el funcionamiento matemático y geométrico que permite el
dibujo de gráficos en el computador.

– UNAD
Individual
 Consultar en internet sobre los temas de la unidad y publicar preguntas en el
foro de la unidad correspondiente para que sean solucionadas por el tutor o

los compañeros.
 Sustentación individual de los programas desarrollados en JAVA.
Desarrollo de un proyecto de programación utilizando texturas e iluminación con el
API 3D. Los enunciados serán entregados por el tutor indicando las fechas y
condiciones de entrega.
Grupo de Curso
 Por cada tipo de algoritmo que se estudia se realizará una práctica en
computadores, para repasar los conceptos básicos y probar los algoritmos
codificados en JAVA.
unidad.
CAPÍTULO 7 Fundamentos del API 2D de JAVA
Lección 31 Características generales del API 2D de Java
31.1 Características generales del API 2D de Java

A continuación se presentan algunas de las características del API 2D de Java, a
partir de la documentación proporcionada por Sun Microsystems para el J2SE.
El API 2D de Java mejora las capacidades de gráficos, texto e imágenes de la
Abstract Windowing Toolkit (AWT), haciendo posible el desarrollo de interfaces de
usuario mejoradas y nuevos tipos de aplicaciones Java. Además de sus mejoras
en gráficos, letra e imágenes, el API 2D de Java soporta mejoras para la definición
y composición del color, además de la detección de formas y texto en formas
– UNAD
geométricas arbitrarias y un modelo de dibujado (rendering) para impresoras y

dispositivos de visualización.
El API 2D de Java también hace posible la creación de librerías gráficas
avanzadas, tales como librerías de CAD-CAM y de gráficos o librerías de efectos
especiales para imágenes, así como la creación de imágenes y de filtros para
archivos gráficos.
Cuando se usa en conjunto con al Java Media Framework y otras APIs de Java
Media, el API 2D de Java puede utilizarse para crear y visualizar animaciones y
otras presentaciones multimedia. Los APIs de Java Animation y Java Media
Framework le proporcionan al API 2D de Java el soporte para el renderizado.
31.1.1 Mejoras de gráficos, texto e imágenes

Las últimas versionas del AWT proporcionaron un paquete simple para construir
páginas comunes HTML, pero no contemplaban características completas
suficientes para dibujar gráficos complejos, texto e imágenes. Como un paquete de
dibujo simplificado, el AWT encapsuló casos específicos de conceptos de
renderizado más general. El API 2D de Java provee una paquete de renderizado
más flexible y con amplias características que expanden el AWT para soportar
gráficos generales y operaciones de renderizado.
A través de la clase Graphics, es posible dibujar rectángulos, elipses y polígonos.
El Graphics2D incorpora el concepto de renderizado geométrico proporcionando un
mecanismo para dibujar virtualmente cualquier forma geométrica. Igualmente, con
el API Java 2D es posible dibujar líneas con estilos, de cualquier ancho y formas
geométricas rellenas con virtualmente cualquier textura.
Las formas geométricas se proporcionan a través de implementaciones de la
interfaz Shape, por ejemplo las figuras Rectangle2D y Ellipse2D. Las curvas y los
arcos también son implementaciones específicas de la interfaz Shape.

Los rellenos y estilos de lápiz (denominado Filete en múltiples aplicaciones de
dibujo) se proporcionan a través de implementaciones de las interfaces Paint y
Stroke, por ejemplo: BasicStroke, GradientPaint, TexturePaint y Color.
La implementación AffineTransform define transformaciones lineales de
coordenadas 2D, incluyendo el escalado, rotación, traslación y recortado.
– UNAD
Las regiones de clipping se definen por las mismas implementaciones de la

interface Shape que se usan para definir regiones generales de clipping, por
ejemplo Rectangle2D y GeneralPath.
Las composiciones de color se proporcionan por implementaciones de la interfaz
Composite, por ejemplo AlphaComposite. Un objeto Font se define como una
colección de Glyphs, que a su vez está definida por Shapes individuales.
31.1.2 Modelo de Renderizado

El mecanismo de renderizado básico es el mismo que en las versiones anteriores
del JDK. El sistema de dibujo o renderizado controla cuándo y cómo dibuja un
programa. Cuando un componente necesita ser mostrado, se llama
automáticamente a su método paint o update dentro del contexto Graphics
apropiado.
Como ya se mencionó, el API 2D de Java presenta java.awt.Graphics2D, un nuevo
tipo de objeto Graphics. Graphics2D desciende de la clase Graphics para
roporcionar acceso a las características avanzadas de renderizado del API 2D de
Java.
Para usar las características del API 2D de Java, tenemos que forzar el objeto
Graphics pasado al método de dibujo de un componente a un objeto Graphics2D.
Como se muestra en el siguiente código:
public void Paint (Graphics g) {
Graphics2D g2 = (Graphics2D) g; ...
}
Al conjunto de atributos de estado asociados con un objeto Graphics2D se le
conoce como Contexto de Renderizado de Graphics2D. Para mostrar texto, formas
o imágenes, podemos configurar este contexto y luego llamar a uno de los métodos
de renderizado de la clase Graphics2D, como draw o fill. Cómo muestra la
siguiente figura, el contexto de renderizado de Graphics2D contiene varios
atributos.
El estilo de lápiz que se aplica al exterior de una forma. Este atributo

stroke permite dibujar líneas con cualquier tamaño de punto y patrón
de sombreado y aplicar finalizadores y decoraciones a la línea.
Algunas aplicaciones de dibujo lo denominan filete.
– UNAD
El estilo de relleno que se aplica al interior de la forma. Este atributo

paint permite rellenar formas con colores sólidos, gradientes o
patrones.
El estilo de composición se utiliza cuando los objetos dibujados se

solapan con objetos existentes.
La transformación que se aplica durante el dibujado para convertir el

objeto dibujado desde el espacio de usuario a las coordenadas de
espacio del dispositivo. También se pueden aplicar otras
transformaciones opcionales como la traducción, rotación escalado,
recortado, a través de este atributo.
El Clip que restringe el dibujado al área dentro de los bordes de un

Shape se utiliza para definir el área de recorte. Se puede usar
cualquier forma para definir un clip.
La fuente se usa para convertir cadenas de texto.
Punto de Renderizado que especifican las preferencias en cuanto a

velocidad y calidad. Por ejemplo, es posible especificar que se desea
usar antialiasing, si está disponible.
Para configurar un atributo en el contexto de renderizado de Graphics2D, se usan

los métodos setAttribute.
setStroke
setPaint
setComposite
setTransform
setClip
– UNAD
setFont
setRenderingHints
Cuando se configura un atributo, se el pasa al objeto el atributo apropiado. Por
ejemplo, para cambiar el atributo paint a un relleno de gradiente azul-gris,
deberíamos construir el objeto GradientPaint y luego llamar a setPaint.
gp = new GradientPaint(0f,0f,blue,0f,30f,green);
g2.setPaint(gp);
Graphics2D contiene referencias a sus objetos atributos, no son clonados. Si se

modifica un objeto atributo que forma parte del contexto Graphics2D, es necesario
llamar al método set para notificarlo al contexto. La modificación de un atributo de
un objeto durante el renderizado puede causar comportamientos impredecibles.
31.1.3 Métodos de renderizado de Graphics2D

Graphics2D proporciona los siguientes métodos generales de dibujado que pueden
usarse para dibujar cualquier primitivo geométrico, texto o imagen.
draw Dibuja el exterior de una forma geométrica primitiva usando los
atributos stroke y paint.
fill Dibuja cualquier forma geométrica primitiva rellenado su interior
con el color o patrón especificado por el atributo paint.
drawString Dibuja cualquier cadena de texto. El atributo font se usa para
convertir la fuente a Glyphs que luego se rellenan con el color o
patrón especificados por el atributo paint.
drawImage Dibuja la imagen especificada.
Además, Graphics2D soporta los métodos de renderizado de Graphics para formas
particulares, como drawOval y fillRect.
Lección 32 Ubicación espacial, textos e imágenes

32.1 Sistema de coordenadas
El sistema 2D de Java mantiene dos sistemas de coordenadas:
– UNAD
 El espacio de usuario es un sistema de coordenadas lógicas independiente

del dispositivo. Las aplicaciones usan este sistema de coordenadas
exclusivamente, y este es el espacio en el que se especifican los gráficos
primitivos del Java 2D.
 El espacio de dispositivo es el sistema de coordenadas para un dispositivo
específico de salida, como una pantalla, una ventana o una impresora. En
un ambiente multi-ventana con un escritorio virtual donde una ventana
puede expandirse más allá de la pantalla del dispositivo físico, este escritorio
virtual se adapta a todas las pantallas.
Aunque el sistema de coordenadas para una ventana o una pantalla podría ser
muy distinto que para una impresora, estas diferencias son invisibles para los
programas Java. Las conversiones necesarias entre el espacio de usuario y el
espacio de dispositivo se realizan automáticamente durante el dibujado.
Espacio de usuario
Como se muestra en la Figura 55, el srcen del espacio de usuario se localiza en la
esquina superior izquierda del espacio, con los valores de x incrementando a la
derecha y los valores de y incrementando hacia abajo.
Figura 55 Espacio de usuario
El espacio del usuario representa una abstracción uniforme de todas los posibles
sistemas de coordenadas de dispositivos. El espacio de dispositivo para un
dispositivo particular podría tener el mismo srcen y dirección del espacio del
usuario, o podrían ser diferentes. Sin embargo, las coordenadas del espacio del
usuario son automáticamente transformadas en las apropiadas para el espacio del
– UNAD
dispositivo cuando se dibuja un objeto gráfico. Frecuentemente, la plataforma

subyacente o driver del dispositivo se utilizan para desarrollar esta conversión.
Espacio de dispositivo
El API 2D de Java define tres niveles de información de configuración que se
mantienen para permitir la conversión desde un espacio de usuario a un espacio de
dispositivo. Esta información está encapsulada en tres clases:
 GraphicsEnvironment
 GraphicsDevice
 GraphicsConfiguration
Entre ellas, representan toda la información necesaria para localizar un dispositivo
de renderizado o fuente en la plataforma Java y para convertir las coordenadas del
espacio de usuario al espacio de dispositivo. Una aplicación puede tener acceso a
esta información, pero no necesita desarrollar modificaciones en ellas.
El GraphicsEnvironment describe la colección de dispositivos de renderizado
disponible para una aplicación Java en un plataforma particular. Los dispositivos
de renderizado incluyen pantallas, impresoras y búferes de imagen. El
GraphicsEnvironment también incluye una lista de todas las fuentes disponibles en
una plataforma.
El GraphicsDevice describe un dispositivo de renderizado visible para la aplicación,
tal como una pantalla o impresora. Cada configuración posible de el dispositivo se
representa por una GraphicsConfiguration. Por ejemplo, un dispositivo de
visualización SVGA puede operara en varios modos: 640*480*16 colores,
640*480*256 colores y 800*600*256 colores. La pantalla SVGA está representada
por un objeto GraphicsDevice y cada uno de los modos es representado por un
objeto GraphicsConfiguration.
Un GraphicsEnvironment puede contener uno o más GraphicsDevice, a su vez,
cada GraphicsDevice puede tener una o más GraphicsConfiguration.
Transformaciones
El API Java 2D ha unificado su modelo de transformación de coordenadas. Todas
las transformaciones de coordenadas, incluyendo transformaciones desde el
espacio del usuario al espacio del dispositivo, son representadas por objetos de la
– UNAD
clase AffineTransform, que define las reglas para manipular coordenadas usando
matrices.
Es posible adicionar un AffineTransform al contexto gráfico para rotar, escalar,
trasladar o recortar una figura geométrica, texto o imagen cuando se esta
renderizando. La transformación adicional se aplica a cualquier objeto gráfico
renderizado en ese contexto. La transformación se realiza cuando el espacio de
coordenadas de usuario se convierte en espacio de coordenadas del dispositivo.
32.2 Fuentes
Una cadena se asume de manera normal, en términos de los caracteres que la
conforman. Cuando se dibuja una cadena, su apariencia está determinada por la
letra o fuente que está seleccionada. Sin embargo, las figuras que la fuente usa
para mostrar la cadena no siempre corresponden con caracteres individuales, por
ejemplo, en publicidad profesional, ciertas combinaciones de dos o más caracteres
se reemplazan a menudo por una figura simple denominada ligature.
Las figuras que una fuente usa para representar los caracteres en las cadenas se
denominan Glyphs. Una fuente puede representar un carácter como una a con
tílde usando varios glyphs, o representar ciertas combinaciones de caracteres
como la fi de final con un único glyph. En el API Java 2D, una glyph es
simplemente un Shape que puede ser manipulado y dibujado en la misma forma
que cualquier otro objeto Shape.
Una fuente puede ser entendida como una colección glyphs. Una única fuente
puede tener muchas versiones, tales como heavy, médium, oblique, ghotic y
regular. Estas diferentes versiones son llamadas caras (faces). Todas las caras de
una fuente tienen un diseño tipográfico similar y pueden ser reconocidas como
miembros de una misma familia. En otras palabras, una colección de glyphs con
una forma particular de estilo conforma una font face, una colección de formas de
font faces forman una font family, y una colección de font families conforma el
grupo de fuentes disponible en un GraphicsEnvironment particular.
En el API Java 2D, las fuentes se especifican por un nombre que describe una
particular font face (por ejemplo: Helvetica Bold) Es diferente a como se asume en
el JDK 1.1, en las que las fuentes eran descritas por nombres lógicos que tomaban
la forma de diferentes font face dependiendo de las fuentes disponibles en la
plataforma particular. Para lograr compatibilidad el API Java 2D soporta la
especificación de fuentes por su nombre lógico y también por su nombre de font
face.
– UNAD
Usando el API 2D de Java es posible componer y dibujar cadenas que contienen

múltiples fuentes, de diferentes familias, caras, tamaños e incluso lenguajes. La
apariencia del texto está separada lógicamente de las características del texto. Los
objetos Font se utilizan para describir la apariencia, y la información de
características del texto se almacena en objetos TextLayout y TextAttibuteSet.
Esta posibilidad hace más fácil de usar la misma fuente en texto con diferentes
características.
32.3 Imágenes
Las imágenes son colecciones de píxeles organizados espacialmente. Un píxel
define la apariencia de una imagen en una ubicación simple. Un arreglo
bidimensional de píxeles se denomina una ráster.
La apariencia del píxel puede definirse directamente o como un índice en una tabla
de color para una imagen. En imágenes que contienen muchos colores (más de
256), los píxeles usualmente representan directamente el color, alpha y otras
características de cada localización de la pantalla. Tales imágenes tienden a ser
muchos más grandes que las imágenes de color indexado (indexed-color
images), pero ellas son más realistas.
En una imagen de color indexado, los colores en la imagen están limitados a los
colores especificados en una tabla de colores, a menudo, el resultado es que sólo
es posible usar unos pocos colores en la imagen. Sin embargo, un índice requiere
menos almacenamiento que un valor de color, por tanto el resultado es que las
imágenes de colores indexados son más pequeñas. El formato de píxel es popular
para las imágenes que contienen sólo 16 o 256 colores.
Las imágenes en el API 2D de java tiene dos componentes primarios:
 Los datos de la imagen srcinal (los píxeles)
 La información necesaria para interpretar los píxeles.
Las reglas para interpretar los píxeles están encapsuladas en un objeto
ColorModel (por ejemplo, los valores podrían ser interpretados de dos formas,
como colores directos o indexados). Para que un píxel pueda ser mostrado, debe
estar relacionado con un modelo de color.
Una banda o canal ( band) es un componente del espacio de color de una imagen.
Por ejemplo, el Rojo (Red), Verde (Green)y Azul (Blue) son las bandas o canales
de una imagen RGB. Un píxel en una imagen de modelo de color directo puede
– UNAD
tomarse de una colección de valores de las bandas para una localización en la

pantalla.
El paquete java.awt.image contiene la implementación de varios ColorModel,
incluyendo representaciones de pixeles empaquetados o comprimidos y de
componente.
Una objetodeColorSpace
conjunto encapsula las
valores numéricos reglas que gobiernan
corresponden la forma
a un color como un
particular. La
implementación del ColorSpace en el java.awt.color representa los espacios de
color más popular, incluyendo RGB y escala de grises. Es importante aclarar que
un espacio de color no es una colección de colores, el define las reglas como
deberán ser interpretados los valores de colores individuales.
Al separar el espacio de color (ColorSpace) del modelo de color (ColorModel) se
proporciona mayor flexibilidad para representar y convertir de una representación
de color a otra.
Lección 33 Rellenos, Filetes y Composiciones

33.1 Rellenos y Filetes
Como ya se había mencionado, con el API 2D de Java es posible usar diferentes
estilos de lápices (filetes) y patrones de relleno. Como el texto está en últimas
representado por un conjunto de glyphs, a las cadenas de texto también se les
puede aplicar atributos de filete y relleno.
Los estilos de lápices están definidos
por objetos que implementan la
interfaz Stroke. El filete hace posible
especificar diferentes anchos y
patrones de diseño para líneas y
curvas.
Figura 56 Dibujo con diferentes tipos de filete
Los patrones de rellenos están definidos por objetos que implementan la interfaz
Paint. La clase Color, que está disponible en versiones anteriores de AWT, es un
tipo simple de un objeto Saint usado para definir rellenos de colores sólidos. El API
2D de Java proporciona dos implementaciones adicionales para Paint,
TexturePaint y GradientPaint.
– UNAD
El TexturePaint define un patrón

de relleno utilizando un simple
fragmento de imagen que se repite
uniformemente. El GradientPaint
define un relleno como un
gradiente entre dos colores.
Figura 57 Relleno de gradiente y de textura
En Java 2D, el renderizado de la línea exterior y el relleno de una figura son dos
operaciones separadas:
Usando el método draw se dibuja el contorno (línea exterior) de la figura usando el
estilo de lápiz especificado en el atributo Stroke y el patrón de relleno especificado
por el atributo Paint.
Usado el método fill se rellena el interior de la figura con el patrón especificado en
el atributo Paint.
Cuando se renderiza una cadena de texto, el atributo actual de Paint se aplica a los
glyphs que forman la cadena. Sin embargo, drawString actualmente rellena los
glyphs que están siendo renderizados. Para modificar el filete del contorno de los
glyphs en una cadena de texto, es necesario enviar el contorno y renderizarlos
como figuras usando el método draw.
33.2 Composiciones (composites)

Cuando se renderiza un objeto que se sobrepone con otro objeto existente, es
necesario determinar como se deben combinar los colores del nuevo objeto von los
colores que ya están ocupando el área donde se está dibujando. El API 2D de
Java encapsula reglas para combinar los colores en el objeto Composite.
Los sistemas de renderizado primitivo proporcionan solamente operadores
boléanos básicos para combinar los colores. Por ejemplo, una regla de
composición booleana puede definir los valores de color de la fuente y el destino a
partir de operaciones de And, OR y XOR. Este enfoque tiene varios inconvenientes,
como lo poco intuitivo para el ser humano, además que este tipo de composiciones
no permite la composición de colores en diferentes espacios de color, además de
no considerar el caso de las imágenes de color indexado, ya que el resultado de la
– UNAD
operación booleana de dos valores de píxel en una imagen es la composición de

dos índices, no de dos colores.
El API 2D de Java evita estos inconvenientes al implementar reglas de mezcla alfa
(alpha-blending) que tienen en cuenta la información acerca del modelo de color al
hacer las composiciones. El objeto alphaComposite incluye el modelo del color de
los colores fuente y destino.
Lección 34 Los paquetes del API 2D de Java

Las clases del API Java 2D está organizada en los siguientes paquetes:
java.awt
java.awt.geom
java.awt.font
java.awt.color
java.awt.image java.awt.image.renderable
java.awt.print
El paquete java.awt contiene algunas clases e interfaces del API Java 2D,
obviamente no todas las clases del java.awt son clases del Java 2D.
AlphaComposite BasicStroke Color
Composite CompositeContext Font
GradientPaint Graphics2D GraphicsConfiguration
GraphicsDevice GraphicsEnvironment Paint
PaintContext Rectangle Shape
Stroke TexturePaint Transparency
El paquete java.awt.geom contiene clases e interfaces relacionadas con la

definición de primitivas geométricas.
AffineTransform Arc2D Arc2D.Double
– UNAD
Arc2D.Float Area CubicCurve2D

CubicCurve2D.Double CubicCurve2D.Float Dimension2D
Ellipse2D Ellipse2D.Double Ellipse2D.Float
FlatteningPathIterator GeneralPath Line2D
Line2D.Double Line2D.Flota PathIterator

Point2D Point2D.Double Point2D.Float
QuadCurve2D QuadCurve2D.Double QuadCurve2D.Float
Rectangle2D Rectangle2D.Double Rectangle2D.Float
RectangularShape RoundRectangle2D RoundRectangle2D.Double
RoundRectangle2D.Float
Muchas de las primitivas geométricas tienen sus correspondientes
implementaciones .Float y .Double. Las implementaciones de doble precisión
proporcionan mayor precisión de renderizado, pero a expensas del desempeño en

algunas plataformas.
El paquete java.awt.font contiene clases e interfaces que se utilizan para
proporcionar características al texto y la definición de fuentes.
FontRenderContext GlyphJustificationInfo GlyphMetrics
GlyphVector GraphicAttribute ImageGraphicAttribute
LineBreakMeasurer LineMetrics MultipleMaster
OpenType ShapeGrapicAttribute TextAttribute
TextHitInfo TextLayout TransformAttribute
El paquete java.awt.color contiene clases e interfaces para la definición de

espacios de color y perfiles de color.
ColorSpace ICC_ColorSpace ICC_Profile
ICC_ProfileGray ICC_ProfileRGB
– UNAD
Los paquetes java.awt.image y java.awt.image.renderable contienen clases e

interfaces para la definición y renderizado de imágenes.
AffineTransformOp BandCombineOp BandedSampleModel
BufferedImage BufferedImageFilter BufferedImageOp
ByteLookupTable ColorConvertOp ColorModel
ComponentColorModel ComponentSampleModel ConvolveOp
ContextualRenderedImageFactory DataBuffer
DataBufferByte DataBufferInt DataBufferShort
DataBufferUShort DirectColorModel IndexColorModel
Kernel LookupOp LookupTable
MultiPixelPackedSampleModel PackedColorModel
ParameterBlock PixelInterleavedSampleModel Ráster
RasterOp RenderableImage RenderableImageOp

RenderContext RenderableImageProducer RenderedImageFactory
RenderedImage RescaleOp SampleModel
ShortLookupTable TileObserver WritableRaster
WritableRenderedImage SinglePixelPackedSampleModel
El API Java 2D mejora las siguientes clases heredadas de la clase image de AWT
ColorModel
DirectColorModel
IndexColorModel
Estas clases de modelo de color recogen las características del java.awt.image
para compatibilidad, y para mantener consistencia, las nuevas clases del modelo
de color también están localizadas en el paquete java.awt.image.
– UNAD
El paquete java.awt.print contiene clases e interfaces que hacen posible la

impresión de todos los objetos gráficos basados en Java 2D, como texto, gráficos e
imágenes.
Book Pageable PageFormat
Paper Printable PrinterGraphics
PrinterJob
Antes de comenzar en serio con los componentes gráficos que proporciona el API
2D de java, es necesario, hacer una pequeña revisión de la clase Graphics,
superclase de Graphics2D y revisar algunos conceptos básicos acerca del contexto
gráfico, que posteriormente permitirán comprender mucho mejor los ejemplos que
se presentarán.
Lección 35 La clase Graphics

La clase Graphics es la clase base abstracta que proporciona toda, o al menos la
mayoría, de la funcionalidad
sobre imágenes para poder pintar tanto sobre componentes como
fuera de pantalla.
Un objeto Graphics encapsula la siguiente información que será necesaria a la hora
de las operaciones básicas de pintado.
El objeto de tipo Component sobre el que se pinta
Un srcen de traslación para coordenadas de pintado y clipping
La región actual ocupada por el componente
El color actual
La fuente de caracteres actual
La operación lógica actual para utilizar con pixeles (XOR o Paint)
La actual alteración de color XOR
Un objeto Graphics describe un contexto gráfico. Un contexto gráfico define una
zona de recorte, una zona a la que va a afectar; cualquier operación gráfica que se
realice modificará solamente los pixeles que se encuentren dentro de los límites de
la zona de recorte actual y el componente que fue utilizado para crear el objeto
Graphics.
– UNAD
Cuando se pinta o escribe, ese dibujo o escritura se realiza en el color actual,

utilizando el modo de dibujo actual y la fuente de caracteres actual.
Hay muchas otras clases, como la clase Rectangle y la clase Polygon, que utilizan
como soporte a las operaciones que se pueden realizar con la clase Graphics.
Para poder revisar esta clase, quizá una de las mejores formas sea a través de sus
múltiples
intentado métodos, intentando
aquí, aunque agruparlos
si el lector porreferencia
quiere una funcionalidad, que yes
completa lo descripción
una que se ha
de los métodos de esta clase deberá recurrir a la documentación que JavaSoft
proporciona sobre el AWT.
Hay que empezar hablando del constructor de la clase Graphics, que no tiene
argumentos; aunque Graphics es una clase abstracta, por lo que las aplicaciones
no pueden llamar a este constructor directamente. Se puede obtener un objeto de
tipo Graphics a partir de otro objeto Graphics llamando al método getGraphics()
sobre un componente. También se puede recibir un objeto Graphics como
parámetro cuando se van a sobreescribir los métodos paint() o update().
35.1 Métodos generales de la clase Graphics

En esta categoría estarían incluidos los métodos útiles en general, sin una
asignación específica de funcionalidad con respecto a acciones determinadas de
dibujo. A continuación se enumeran algunos de los métodos considerados
generales, para seguir con la descripción y uso de algunos de ellos en aplicaciones
de ejemplo.
clearRect( int,int,int,int ), se le pasa un rectángulo y borra la zona con el color que
se haya establecido de fondo para la superficie donde se está pintando.
copyArea( int,int,int,int,int,int ), copia la zona rectangular del componente que se
indica en los primeros cuatro parámetros, en otra posición del contexto gráfico
desplazada las distancia indicada en los dos últimos parámetros.
create(), crea un nuevo objeto de tipo Graphics que es copia del objeto Graphics
que ha invocado al método.
dispose(), elimina el contexto gráfico sobre el cual es invocado y devuelve al
sistema todos los recursos que estaba utilizando, incluyendo todos los recursos, no
solamente la memoria. Un objeto Graphics no se puede utilizar después de haber
llamado a este método; y es importante que se eliminen estos objetos
manualmente, bien sea creados directamente desde un componente o a partir de
– UNAD
otro objeto Graphics, cuando ya no se necesiten, en lugar de esperar a que se

finalice la ejecución.
finalice(), elimina el contexto gráfico cuando ya no hay ninguna referencia sobre él.
getColor(), devuelve el color actual fijado para el contexto gráfico.
setColor( Color ), fija el color del contexto gráfico al color que se pasa como
parámetro. Todas las operaciones gráfica siguientes que utilicen este contexto
gráfico, utilizarán el color que se especifica en este método.
setPaintMode(), fija la forma de pintar del contexto gráfico de modo que se
sustituya lo que había con lo nuevo. Cualquier operación de pintado sobreescribirá
lo que hubiese en la zona de destino con el color actual.
setXORMode( Color ), fija la forma de pintar del contexto gráfico a una alternancia
entre en color actual y el color de la zona de destino.
toString(), devuelve un objeto de tipo String representando el valor del objeto
Graphics.
translate( int,int ), en
los dos parámetros traslada el srcen
el sistema del contexto que
de coordenadas gráfico al punto
se esté que se pasa en
utilizando.
35.2 Obtener un contexto gráfico

La verdad es que se han escrito varias veces las palabras contexto gráfico, y no se
ha proporcionado al lector una explicación concreta de lo que significan estos
términos. Hay varias definiciones, para unos significa que la aplicación ha
conseguido la habilidad para pintar o colocar imágenes sobre un componente que
tiene la característica de soportar el pintado o visualización de imágenes. Otros
autores prefieren decir que cada objeto Graphics representa una determinada
superficie
del cual sede dibujo,manipular
pueden luego esetodas
objeto
lasGraphics define
actividades un contexto
gráficas gráfico
sobre esa a través
superficie. Y
otros autores indican que un objeto Graphics es la superficie última sobre la que se
pueden colocar líneas, figuras y texto, por lo cual puede recibir también el nombre
de contexto gráfico al aunar información sobre la zona de dibujo, más la fuente de
caracteres, color y cualquier otro factor.
Ahora que ya se sabe lo que es un contexto gráfico, hay que ver cómo se consigue
crear uno. Para empezar, esto no puede hacerse instanciando directamente un
objeto de tipo Graphics, ya que la clase Graphics es abstracta y no puede ser
– UNAD
instanciada por el código de la aplicación, así que hay que recurrir a formas
indirectas para conseguir el contexto gráfico.
Uno de estos caminos indirectos para obtener un contexto gráfico es invocar el
método getGraphics() sobre otro objeto. Sin embargo, este método devuelve un
contexto gráfico de una imagen, es decir, que solamente funciona para objetos de
tipo Image creados en memoria a través del método createImage(), de la clase
Component. Esta es una técnica utilizada normalmente cuando se están usando
imágenes que se crean en memoria y luego se transfieren a la pantalla, es decir, se
está pintando en el doble buffer.
Hay otros dos caminos para obtener un contexto gráfico y, son sorprendentemente
simples, porque se hace automáticamente, y es cuando se sobreescriben los
métodos paint() y update(), en los cuales Java pasa como parámetro el contexto
gráfico del objeto al que pertenece el método.
Normalmente, el método paint() se sobreescribe cuando se quiere colocar algún
tipo de material gráfico sobre la pantalla, y el método update() se sobreescribe en
circunstancias especiales, como puede ser el caso de una animación o que se vaya
a utilizar doble buffer. Lo normal es pues la presentación de información gráfica
colocando el código encargado de ello en el método sobreescrito paint() y luego
invocando al método repaint() para indicar al sistema que presente ese material en
pantalla; aunque el método paint() también puede ser invocado por causas
externas, sin control alguno por parte de la aplicación, como puede ser el
redimensionamiento de la ventana en la que se está presentando la información
gráfica.
Hay que tener en cuenta que el método repaint() pide al sistema que redibuje el
componente tan pronto como sea posible, pero esto lo hará el método update() que
se llame a continuación. No hay una relación uno a uno entre las llamadas a
repaint() y update(), por lo que es posible que múltiples llamadas a repaint() puedan
recogerse en una sola llamada a update().
El método update() es invocado automáticamente cuando se pide repintar un
Componente. Si el componente no es ligero (lightweight), la implementación por
defecto de update() borra el contexto gráfico rellenando el fondo en el color que se
haya asignado como color de fondo, fijando de nuevo el color al color del primer
plano y llamando a paint(). Si no se sobreescribe update() para hacer una
animación, se verá siempre un parpadeo en el refresco del componente por causa
de este borrado del fondo.
– UNAD
En síntesis, el método paint() es el que ofrece el sistema para poder pintar lo que
se quiera sobre un determinado componente. En la clase base Component, este
método no hace absolutamente nada. Normalmente, en el caso de applets, se
sobreescribe para hacer presentar un rectángulo relleno con el color de fondo.
Veamos un primer ejemplo básico de obtención del contexto gráfico y pintado de
una cadena de texto en un objeto Frame en la Figura 58. Notará que se utiliza la
clase Frame del AWT y no la JFrame del Swing, ya que se quieren asegurar la
compatibilidad.
Figura 58 Primer ejemplo de dibujo utilizando Java 2D
Observe que en la línea 36 se está convirtiendo el contexto gráfico srcinal g en un

contexto gráfico 2D denominado g2, que es el que finalmente se utiliza para dibujar
la cadena.
CAPÍTULO 8 API 3D de JAVA
Lección 36 Figuras básicas en Java 2D (Shape)

Las clases del paquete java.awt.geom definen gráficos primitivos comunes, como
puntos, líneas, curvas, arcos, rectángulos y elipses.
Las clases en el paquete java.awt.geom son:
Arc2D Ellipse2D QuadCurve2D
– UNAD
Area GeneralPath Rectangle2D

CubicCurve2D Line2D RectangularShape
Dimension2D Point2D RoundRectangle2D
Excepto para Point2D y Dimension2D, cada una de las otras clases geométricas
implementa el interfaz Shape, que proporciona un conjunto de métodos comunes
para describir e inspeccionar objetos geométricos bi-dimensionales.
Con estas clases podemos crear de forma virtual cualquier forma geométrica y
dibujarla a través de Graphics2D llamando al método draw o al método fill.
36.1 Formas Rectangulares

Los primitivos Rectangle2D, RoundRectangle2D, Arc2D, y Ellipse2D descienden de
la clase RectangularShape, que define métodos para objetos Shape que pueden
ser descritos por una caja rectangular. La geometría de un RectangularShape
puede ser extrapolada desde un rectángulo que encierra completamente el exterior
de la forma, como se muestra en la siguiente figura.
Figura 59 Formas rectangulares
36.2 GeneralPath
La clase GeneralPath permite crear una curva arbitraria especificando una serie de
posiciones a lo largo de los límites d e la forma.
Estas posiciones pueden ser conectadas por
segmentos de línea, curvas cuadráticas o curvas
cúbicas.
Esta figura puede ser creada con 3 segmentos de
Figura 60 Forma GeneralPath línea y una curva cúbica.
– UNAD
El siguiente ejemplo muestra el uso de algunos de estos objetos gráficos y además

de las opciones para relleno y filete. El código srcinal corresponde en un demo
proporcionado en el tutorial de Java 2D de la documentación del J2SE.
Figura 61 Ejecución del renderizado de figuras primitivas
El código comentado se muestra a continuación. Como se dará cuenta es bastante

extenso, por lo que se recomienda seguirlo cuidadosamente. Una vez lo ha
implementado y comprendido, intente realizar modificaciones en los parámetros de
dibujo de las diferentes figuras.
/*
* Este es un ejemplo sobre el dibujo de Shapes, proporcionado por la
* documentación de Java en la versión 1.2.
*/
import java.awt.*;
import java.awt.event.*;
import java.awt.geom.*;
import javax.swing.*;
/*
* La clase se crea como hija de la clase Applet. Si se define como hija
– UNAD
* directa de la clase Frame, se tiene problemas al redimensionar el

* Frame, ya que no se redibujan automáticamente las figuras.
*/
public class ShapesDemo2D extends JApplet {

final static int maxCharHeight = 15;
final static int minFontSize = 6;
final static Color bg = Color.white;

final static Color fg = Color.black;
final static Color red = Color.red;
final static Color white = Color.white;
//Definición de los tipos de filete

final static BasicStroke stroke = new BasicStroke(2.0f);
final static BasicStroke wideStroke = new BasicStroke(8.0f);
final static float dash1[] = {10.0f};

final static BasicStroke dashed = new BasicStroke(1.0f,
BasicStroke.CAP_BUTT,
BasicStroke.JOIN_MITER,
10.0f, dash1, 0.0f);
Dimension totalSize;
FontMetrics fontMetrics;
public void init() {

//Initialize drawing colors
setBackground(bg);
setForeground(fg);
}
/* Permite redimensionar el tamaño de la letra a partir de un objeto de tipo Fontmetrics

* dependiendo del tamaño del contexto gráfico, si se amplía el tamaño de la ventana, la
* letra se ampliará, si se disminuye el tamaño del contexto la letra disminuirá
*/
FontMetrics pickFont(Graphics2D g2,
String longString,
– UNAD
int xSpace) {
boolean fontFits = false;
Font font = g2.getFont();
FontMetrics fontMetrics = g2.getFontMetrics();
int size = font.getSize();
String name = font.getName();
int style = font.getStyle();
while ( !fontFits ) {
if ( (fontMetrics.getHeight() <= maxCharHeight)
&& (fontMetrics.stringWidth(longString) <= xSpace) ) {
fontFits = true;
}
else {
if ( size <= minFontSize ) {
fontFits = true;
}
else {
g2.setFont(font = new Font(name,
style,
--size));
fontMetrics = g2.getFontMetrics();
}
}
}
return fontMetrics;
}
public void paint(Graphics g) {

Graphics2D g2 = (Graphics2D) g;
g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
RenderingHints.VALUE_ANTIALIAS_ON);
/* Toma las dimensiones del contexto y lo divide para saber el ancho y alto de
* cada una de las celdas de la cuadrícula donde dibujará
*/
– UNAD
Dimension d = getSize();
int gridWidth = d.width / 6;
int gridHeight = d.height / 2;
//Obtiene el tamaño de la letra a partir de la cadena más larga a escribir
fontMetrics = pickFont(g2, "GeneralPath con relleno y contorno",

gridWidth);
//Dibuja el cuadrado general que sirve de fondo al applet

Color fg3D = Color.lightGray;
g2.setPaint(fg3D);
g2.draw3DRect(0, 0, d.width - 1, d.height - 1, true);
g2.draw3DRect(3, 3, d.width - 7, d.height - 7, false);
g2.setPaint(fg);
int x = 5;
int y = 7;
int rectWidth = gridWidth - 2*x;
int stringY = gridHeight - 3 - fontMetrics.getDescent();
int rectHeight = stringY - fontMetrics.getMaxAscent() - y - 2;
// Dibuja una línea con su respectivo texto inferior

g2.draw(new Line2D.Double(x, y+rectHeight-1, x + rectWidth, y));
g2.drawString("Line2D", x, stringY);
x += gridWidth;
// Asigna un filete, dibuja el rectángulo y debajo su respectivo texto
g2.setStroke(stroke);
g2.draw(new Rectangle2D.Double(x+5, y+5, rectWidth-5, rectHeight-5));
g2.drawString("Rectangle 2D", x, stringY);
x += gridWidth;
/* Asigna el filete como punteado, dibuja un rectángulo con

* bordes redondeados y su texto inferior
* Los parámetros de creación del objeto correspoden al valor en x e y inicial
* x e y final y el radio de la circunferencia que define las puntas redondeadas.
– UNAD
*/
g2.setStroke(dashed);
g2.draw(new RoundRectangle2D.Double(x+20, y+20, rectWidth-40,
rectHeight-40, 40, 40));
g2.drawString("RoundRectangle2D", x, stringY);
x += gridWidth;
/* Asigna el filete, dibuja un arco con 7 parámetros de construcción.

* Ellos son: el rectángulo que enmarca el arco tiene esquina superior izquierda en
* en x,y,el valor máximo en x, el valor máximo en y. Los siguientes dos parámetros
* corresponde a los ángulos de inicio y fin del arco, en este caso 60 y 135 grados.
* Finalmente el último parámetro corresponde al tipo de arco, los posibles valores son
* OPEN, CHORD, PIE.
* Debajo escribe el texto correspondiente
*/
g2.setStroke(wideStroke);
g2.draw(new Arc2D.Double(x, y, rectWidth, rectHeight, 60, 135, Arc2D.OPEN));
g2.drawString("Arc2D", x, stringY);
x += gridWidth;
// Asigna el filete, dibuja una elipse y el texto inferior correspondiente g2.setStroke(stroke);

g2.draw(new Ellipse2D.Double(x, y, rectWidth, rectHeight));
g2.drawString("Ellipse2D", x, stringY);
x += gridWidth;
/* Asigna el filete, crea unos vectores con las coordenadas de los puntos del polígono,
* crea el objeto GeneralPath (polygon) trazando lineas entre las coordenadas
* y finalmente cierra el poligono. Dibuja el polígono y el texto inferior
* correspondiente.
*/
g2.setStroke(stroke);
int x1Points[] = {x, x+rectWidth, x, x+rectWidth};
int y1Points[] = {y, y+rectHeight, y+rectHeight, y};
GeneralPath polygon = new GeneralPath(GeneralPath.WIND_EVEN_ODD, x1Points.length);
polygon.moveTo(x1Points[0], y1Points[0
for ( int index = 1; index < x1Points.length; index++ ) {
polygon.lineTo(x1Points[index], y1Points[index
– UNAD
};
polygon.closePath();
g2.draw(polygon);
g2.drawString("GeneralPath", x, stringY);
// Modifica los valores de coordenadas x e y para dibujar la segunda fila
x = 5;
y += gridHeight;
stringY += gridHeight;
/* Realiza los mismo pasos que para el polígono anterior, lo que varía es
* que en este caso no se cierra el polígono
*/
GeneralPath polyline = new GeneralPath(GeneralPath.WIND_EVEN_ODD, x2Points.length);
polyline.moveTo (x2Points[0], y2Points[0

polyline.lineTo(x2Points[index], y2Points[index
};
g2.draw(polyline);
g2.drawString("GeneralPath (Abierto)", x, stringY);
x += gridWidth;
/* Asigna el color de relleno a azul. Rellena un objeto rectángulo y lo dibuja. Nuevamente

* asigna el color, en este caso al negro y dibuja el texto inferior correspondiente
*/
g2.setPaint(Color.blue);
g2.fill(new Rectangle2D.Double(x, y, rectWidth, rectHeight));

g2.setPaint(fg);
g2.drawString("Rectangle2D con relleno", x, stringY);
x += gridWidth;
/* Define el objeto gradiente para rellenar el rectángulo redondeado, partiendo

* del color rojo hasta el color amarillo. Ese objeto GradientPaint se envía como
* color de relleno mediante el setPaint. Se dibuja el rectángulo redondeado.
* Se restaura el color de dibujo al negro y se dibuja el texto inferior.
– UNAD
*/
GradientPaint relleno = new GradientPaint(x,y,red,x+rectWidth, y,Color.yellow);
g2.setPaint(relleno);
g2.fill(new RoundRectangle2D.Double(x, y, rectWidth,
rectHeight, 10, 10));
g2.setPaint(fg);
g2.drawString("RoundRectangle2D con gradiente", x, stringY);

x += gridWidth;
// Define el color de relleno en rojo y dibuja el arco.

g2.setPaint(red);
g2.fill(new Arc2D.Double(x, y, rectWidth, rectHeight, 90, 135, Arc2D.PIE));
g2.setPaint(fg);
g2.drawString("Arc2D con relleno", x, stringY);
x += gridWidth;
// Define un relleno de gradiente de rojo a blanco y dibuja la elipse rellena.
relleno = new GradientPaint(x,y,red,x+rectWidth, y,white);

g2.setPaint(relleno);
g2.fill (new Ellipse2D.Double(x, y, rectWidth, rectHeight));
g2.setPaint(fg);
g2.drawString("Ellipse2D con gradiente", x, stringY);
x += gridWidth;
/* Define los arreglos de las coordenadas para el polígono. Crea el polígono uniendo
* los puntos con líneas. Asigna el color rojo y dibuja el polígono relleno.
* Retorna el valor de la pintura a negro y dibuja el polígono mediante draw, lo
* que srcina que se sibuje el filete del polígono.
*/
GeneralPath filledPolygon = new GeneralPath(GeneralPath.WIND_EVEN_ODD,
x3Points.length);
filledPolygon.moveTo(x3Points[0], y3Points[0
filledPolygon.lineTo(x3Points[index], y3Points[index
};
– UNAD
filledPolygon.closePath();
g2.setPaint(Color.yellow);
g2.fill(filledPolygon);
g2.setPaint(fg);
g2.setStroke(wideStroke);
g2.draw(filledPolygon);
g2.drawString("GeneralPath con relleno y contorno", x, stringY);

}
//Clase que se ejecuta

public static void main(String s[]) {
//Crea el Frame
JFrame f = new JFrame("Demo de Figuras Primitivas");
f.addWindowListener(new WindowAdapter() {
public void windowClosing(WindowEvent e) {System.exit(0);}
});
//Crea el applet de acuerdo a la clase ShapesDemo2D
JApplet applet = new ShapesDemo2D();

//Agrega el objeto applet al Frame
f.getContentPane().add("Center", applet);
applet.init();
f.pack();
f.setSize(new Dimension(550,300));
f.show();
}
}
36.3 QuadCurve2D y CubicCurve2D

La clase QuadCurve2D permite crear segmentos de curvas cuadráticos. Una curva
cuadrática está definida por dos puntos finales y un punto de control.
La clase CubicCurve2D permite crear segmentos de curvas cúbicos. Una curva
cúbica está definida por dos puntos finales y dos puntos de control, los segmentos
de curvas cúbicos también se conocen como curvas de Bézier. Las siguientes
figuras muestran ejemplos de curvas cuadráticas y cúbicas.
– UNAD
Figura 62 Formas Curvas
El siguiente código crea una curva cuadrática con dos puntos finales y un punto de
control. Las posiciones de los puntos se seleccionan con respecto al tamaño de la
ventana.
import java.awt.*;
public class EjemploQuad extends JApplet {

setBackground(Color.white);
setForeground(Color.black);
}

int w = d.width;
int h = d.height;
//Crea el objeto de tipo QuadCurve2D

QuadCurve2D.Double quad = new QuadCurve2D.Double();
– UNAD
//Crea los objetos que definen los puntos de inicio, final y control
Point2D.Double inicio, fin, control;
inicio = new Point2D.Double();
fin = new Point2D.Double();
control = new Point2D.Double();
//Le asigna coordenadas a los puntos en x e y a partir del tamaño de la ventana

inicio.setLocation(w/2-100, h/2+50);
fin.setLocation(w/2+100, h/2+50);
control.setLocation((int)(inicio.x)+100, (int)(inicio.y)-100);
quad.setCurve(inicio, control, fin); //Construye la curva
//Define color y filete

g2.setPaint(Color.magenta);
g2.setStroke(new BasicStroke(2.0f));
//Dibuja la curva
g2.draw(quad);
//Modifica el color para dibujar los puntos como rectángulos

g2.setPaint(Color.black);
g2.fill(new Rectangle2D.Double(inicio.x, inicio.y,3,3));
g2.drawString("Inicio", (int) inicio.x+5,(int) inicio.y+5);
g2.fill(new Rectangle2D.Double(fin.x, fin.y,3,3));
g2.drawString("Fin",(int) fin.x+5, (int)fin.y+5);
g2.fill(new Rectangle2D.Double(control.x, control.y,3,3));
g2.drawString("Control",(int)control.x+5, (int)control.y+5);
}
//Clase que se ejecuta
//Crea el Frame
JFrame f = new JFrame("Dibujando un QuadCurve2D");
});
– UNAD
//Crea el applet de acuerdo a la clase ShapesDemo2D

JApplet applet = new EjemploQuad();
//Agrega el objeto applet al Frame
applet.init();
f.pack();
f.show();
}
}
La ejecución de este código proporciona la siguiente ventana gráfica:
Intente
que dibujeimplementar
una curvauna aplicación
cúbica, dibuje
también los puntos de referencia para
la curva, mediante rectángulos
rellenos. Aplique diferentes tipos de
filete, a partir de lo ya visto.
Figura 63 Ejecución del dibujo de una curva

cuadrática
Lección 37 Áreas
Con la clase Area se pueden realizar operaciones boolenas, como uniones,
intersecciones y substracciones, sobre dos objetos Shape cualquiera. Esta técnica,
permite crear rápidamente objetos Shape complejos sin tener que describir cada
línea de segmento o cada curva, este proceso se denomina construir un área
geométrica (CAG). Una Area soporta las siguientes operaciones booleanas.
– UNAD
unión Sustracción
Or-Exclusivo
Intersección (XOR)
En el siguiente ejemplo, tomado del tutorial de gráficos del sitio web de

Programación en castellano, se crea un Area que dibuja una pera a partir de
objetos elipses y operaciones de unión, sustracción e intersección. La ejecución
proporciona la siguiente ventana gráfica.
Figura 64 Formación de una pera a partir de operaciones de área
El código que se requiere para el renderizado de este gráfico se presenta a

continuación.
import java.awt.*;
import java.awt.font.*;
import java.applet.*;
/*
* Este applet dibuja una pera, usando métodos de Constructive Area Geometry (CSG)
– UNAD
* para adición, sustracción e intersección.

*/
public class Pera extends Applet {
Ellipse2D.Double circle, oval, leaf, stem;
Area circ, ov, leaf1, leaf2, st1, st2;

circle = new Ellipse2D.Double();
oval = new Ellipse2D.Double();
leaf = new Ellipse2D.Double();
stem = new Ellipse2D.Double();
circ = new Area(circle);
ov = new Area(oval);
leaf1 = new Area(leaf);
st1 = new Area(stem);

}
public void paint (Graphics g) {

//Toma las dimensiones del contexto gráfico, en este caso el Frame

int w = d.width;
int h = d.height;
double ew = w/2;
double eh = h/2;
g2.setColor(Color.green);
/* Crea la primera hoja a partir de la intersección de dos objetos Area, creados

* a partir de una elipse
– UNAD
*/
leaf.setFrame(ew-16, eh-29, 15.0, 15.0);
leaf.setFrame(ew-14, eh-47, 30.0, 30.0);
leaf1.intersect(leaf2);
g2.fill(leaf1);
// Crea la segund hoja.

leaf.setFrame(ew+1, eh-29, 15.0, 15.0);
leaf2.intersect(leaf1);
g2.fill(leaf2);
g2.setColor(Color.black);
/* Crea el pedazo de tronco a partir del llenado del Area resultante de la sustracción de
* dos objetos Area creados a partir de una elipse.

*/
stem.setFrame(ew, eh-42, 40.0, 40.0);
stem.setFrame(ew+3, eh-47, 50.0, 50.0);
st1.subtract(st2);
g2.fill(st1);
g2.setColor(Color.yellow);
/* Crea el cuerpo de la pera llenado el Area resultante de la unión de dos objetos

* Area, creados de una elipse un circulo.
*/
circle.setFrame(ew-25, eh, 50.0, 50.0);
oval.setFrame(ew-19, eh-20, 40.0, 70.0);
circ = new Area(circle);
ov = new Area(oval);
circ.add(ov);
g2.fill(circ);
– UNAD
}
JFrame f = new JFrame("Pera");
});
Applet applet = new Pera();

applet.init();
f.pack();
f.show();
}
}
Lección 38 Texto y Fuentes

Es posible mostrar una cadena de texto con cualquier tipo de letra disponible en el
sistema, en cualquier tamaño y en el estilo que se seleccione. Para determinar las
fuentes que están disponibles en el sistema es necesario llamar el método
GrpahicsEnvironment.getAvailableFontFamilyNames. Este método retorna un
arreglo de cadenas que contiene los nombres de las familias de las fuentes
disponibles, cualquiera de estas cadenas, además del tamaño y el estilo, pueden
ser utilizados como argumentos para crear un nuevo objeto Font.
El siguiente ejemplo, muestra
una aplicación donde es
posible seleccionar el tipo de
fuente, tamaño y estilo a partir
de 3 objetos combo y observar
las modificaciones en la
cadena dibujada. El ejemplo
es tomado del Tutorial de Java
2D de Sun Microsystems. La
ejecución del programa genera
Figura 65 Ejemplo de dibujo de fuentes una pantalla como la que se
muestra al lado.
– UNAD
Para construir el ejemplo, es necesario utilizar el siguiente código que permite

obtener los datos de las fuentes instaladas en el sistema y guardarlos en un objeto
Vector, que posteriormente puede pasarse a un combo que despliegue los
nombres de las fuentes:
GraphicsEnvironment gEnv = GraphicsEnvironment.getLocalGraphicsEnvironment();
String envcmbFuente[] = gEnv.getAvailableFontFamilyNames();
Vector vector = new Vector();
for ( int i = 1; i < envcmbFuente.length; i++ ) {
vector.addElement(envcmbFuente[i
}
cmbFuente = new JComboBox( vector );
cmbFuente.setMaximumRowCount( 9 );
cmbFuente.addItemListener(this);
nuevafuente = envcmbFuente[0];
pnlLetra.add(cmbFuente);
A continuación
Los otros estilossedisponibles
crea un objeto Font conBOLD
son ITALIC, un estilo Font.PLAIN y un tamaño de 10.
y BOLD+ITALIC.
Font thisFont;
...
thisFont = new Font("Arial", Font.PLAIN, 10);
Posteriormente es posible crear un nuevo objeto Font a partir de un nombre de

fuente, estilo y tamaño, que pueden seleccionarse de distintos combo. Al
seleccionarse el tamaño el valor de item es de tipo cadena, por lo que se debe
convertir a entero para poder crear la nueva fuente.
public void cambiarFuente(String nf, int nest, String ntam){
Integer nuevoTam = new Integer(ntam);
int tam = nuevoTam.intValue();
thisFont = new Font(nf, nest, tam);
repaint();
}
`
– UNAD
Para controlar la fuente que se utiliza para dibujar el texto, es necesario enviar los
atributos de la fuente al contexto Graphics2D antes de renderizar. Los atributos de
la fuente se envían pasando un objeto Font al método setFont. En este ejemplo,
los atributos son envidos al construir el nuevo objeto Font y la cadena se dibuja en
el centro del componente usando esta fuente. Cada vez que se modifiquen los
atributos, se construye un nuevo objeto Font y se envía al contexto Graphics 2D en
el metodo Paint() para que sean redibujados. El método getFontMetrics permite
medir la longitud en píxeles de la cadena considerando los nuevos atributos, de
manera que siempre se dibuje en el centro del componente.
g2.setFont(thisFont);
String cadena = "Seleccione una fuente, tamaño y estilo para modificarme";
FontMetrics medida = g2.getFontMetrics();
int ancho = medida.stringWidth( cadena );
int alto = medida.getHeight();
//Dibuja la cadena en el centro del panel correspondiente
g2.drawString( cadena, w/2-ancho/2, h/2-alto/2 ); }
El código completo del ejemplo, comentado se muestra a continuación:

/*
* Ejemplo de selección de fuentes. Construido para el Tutorial
* de Java2D de Sun Microsystems.
*/
import java.lang.Integer;
import java.awt.*;
import java.awt.font.*;
import java.util.Vector;
public class FontSelection extends JApplet implements ItemListener {

JLabel lblFuente, lblTamano, lblEstilo;
pnlLetra fontC;
JComboBox cmbFuente, cmbTamano, cmbEstilo;
int i = 0;
– UNAD
String nuevafuente = "Fuente sin seleccionar";

int nuevoestilo = 0;
String nuevotam = "10";
getContentPane().setLayout( new BorderLayout() );
JPanel pnlSuperior = new JPanel();

JPanel pnlLetra = new JPanel();
JPanel pnlTamano = new JPanel();
JPanel pnlEstilo = new JPanel();
JPanel pnlEstiloTamano = new JPanel();
//Se asignan las distribuciones para cada panel

pnlSuperior.setLayout( new BorderLayout() );
pnlLetra.setLayout( new GridLayout( 2, 1 ) );
pnlTamano.setLayout( new GridLayout( 2, 1 ) );

pnlEstilo.setLayout( new GridLayout( 2, 1 ) );
pnlEstiloTamano.setLayout( new BorderLayout() );
//Incluye cada panel dentro de los correspondientes para visualizar mejor

//la distribución de la aplicación
pnlSuperior.add( BorderLayout.WEST, pnlLetra );
pnlEstiloTamano.add( BorderLayout.WEST, pnlTamano );
pnlEstiloTamano.add( BorderLayout.CENTER, pnlEstilo );
pnlSuperior.add( BorderLayout.CENTER, pnlEstiloTamano );
getContentPane().add( BorderLayout.NORTH, pnlSuperior );
//Asigna características a la etiqueta de texto Fuentes

lblFuente = new JLabel();
lblFuente.setText("Fuentes");
Font newFont = getFont().deriveFont(1);
lblFuente.setFont(newFont);
lblFuente.setHorizontalAlignment(JLabel.CENTER);
pnlLetra.add(lblFuente);
– UNAD
//Asigna características a la etiqueta de texto Tamaño

lblTamano = new JLabel();
lblTamano.setText("Tamaño");
lblTamano.setFont(newFont);
lblTamano.setHorizontalAlignment(JLabel.CENTER);
pnlTamano.add(lblTamano);
//Asigna características a la etiqueta de texto Estilo

lblEstilo = new JLabel();
lblEstilo.setText("Estilo");
lblEstilo.setFont(newFont);
lblEstilo.setHorizontalAlignment(JLabel.CENTER);
pnlEstilo.add(lblEstilo);
/*Se obtienen las fuentes disponibles en el contexto gráfico

*se asignan al objeto vector que posteriomente es enviado al combo
*de Fuentes. Se asigna un máximo de items para mostrar en el combo de 9 fila

*y se predetermina como fuente inicial, la primera fuente ubicada (indice 0).
*Finalmente se agrega el combo al panel correspondiente.
*/
GraphicsEnvironment gEnv = GraphicsEnvironment.getLocalGraphicsEnvironment();
String envcmbFuente[] = gEnv.getAvailableFontFamilyNames();
Vector vector = new Vector();
for ( int i = 1; i < envcmbFuente.length; i++ ) {
vector.addElement(envcmbFuente[i
}
cmbFuente = new JComboBox( vector );
cmbFuente.setMaximumRowCount( 9 );
cmbFuente.addItemListener(this);
nuevafuente = envcmbFuente[0];
pnlLetra.add(cmbFuente);
/*Se asignan los valores para el combo de tamaño, los posibles tamaños serán 10,
*12,14,16,18. Se define como máximo número de filas a mostrar 9. Se agrega el
combo
*al panel correspondiente.
– UNAD
*/
cmbTamano = new JComboBox( new Object[]{ "10", "12", "14", "16", "18"} );
cmbTamano.setMaximumRowCount( 9 );
cmbTamano.addItemListener(this);
pnlTamano.add(cmbTamano);
/*Se arma el combo de estilo a partir de los estilos predeterminados.se siguen los mismo
*pasos que para los combos anteriores y finalmente se incluye el combo en el panel
*correspondiente.
*/
cmbEstilo = new JComboBox( new Object[]{
"PLAIN",
"BOLD",
"ITALIC",
"BOLD & ITALIC"} );
cmbEstilo.setMaximumRowCount( 9 );
cmbEstilo.addItemListener(this);
cmbTamano.setMaximumRowCount( 9 );
pnlEstilo.add(cmbEstilo);
/*Se especifican las caracteristicas del Panel que va a contener el texto.

*/
fontC = new pnlLetra();
fontC.setBackground(Color.white);
getContentPane().add( BorderLayout.CENTER, fontC);
}
/* El siguiente método detecta cuando se ha realizado la modificación de item
* en alguno de los combos.

*/
public void itemStateChanged(ItemEvent e) {
if ( e.getStateChange() != ItemEvent.SELECTED ) {
return;
}
Object combomodif = e.getSource(); //Obtiene el objeto combo que cambió de item

– UNAD
//Compara con cada uno de los combos posibles

if ( combomodif == cmbFuente ) {
nuevafuente = (String)cmbFuente.getSelectedItem();
} else if ( combomodif == cmbEstilo ) {
i = cmbEstilo.getSelectedIndex();
nuevoestilo = i;
} else {
nuevotam = (String)cmbTamano.getSelectedItem();
}
//Cambia la fuente del contexto, de acuerdo con los nuevos atributos seleccionados en los
combo
fontC.cambiarFuente(nuevafuente, nuevoestilo, nuevotam);
}

JFrame f = new JFrame("Ejemplo de renderizado de texto");

});
JApplet Seleccion = new FontSelection();

f.getContentPane().add(Seleccion, BorderLayout.CENTER);
Seleccion.init();
f.setVisible(true);
}
class pnlLetra extends JPanel {
Font thisFont;
public pnlLetra(){
thisFont = new Font("Arial", Font.PLAIN, 10);
}
– UNAD
// Este método es el que modifica la fuente de acuerdo con los nuevos parámetros
public void cambiarFuente(String nf, int nest, String ntam){
Integer nuevoTam = new Integer(ntam);
int tam = nuevoTam.intValue();
thisFont = new Font(nf, nest, tam);
repaint();
}
public void paintComponent (Graphics g) {

super.paintComponent( g );
int w = getWidth();
int h = getHeight();
g2.setColor(Color.darkGray);
g2.setFont(thisFont);
String cadena = "Seleccione una fuente, tamaño y estilo para modificarme";

FontMetrics medida = g2.getFontMetrics();
int ancho = medida.stringWidth( cadena );
int alto = medida.getHeight();
//Dibuja la cadena en el centro del panel correspondiente
g2.drawString( cadena, w/2-ancho/2, h/2-alto/2 );
}
}
Se recomienda revisar el ejemplo y plantear una solución para cuando el texto no

cabe en una línea y se requiere separarlo, como en el caso de un párrafo.
Lección 39 Imágenes
El API 2D de Java implementa un nuevo modelo de imagen que permite la
manipulación de imágenes de resolución fija almacenadas en memoria. La clase
BufferedImage es una nueva clase Image en el paquete java.awt.image, que puede
usarse para manipular datos de una imagen recuperados desde un archivo o una
URL. Por ejemplo, se puede usar un BufferedImage para implementar doble búfer .
– UNAD
Las clases BufferedImage y BufferedImageOp también permiten realizar una gran

variedad de operaciones de filtrado de imágenes como blur o sharpen. El modelo
de imagen productor/consumidor proporcionado en las versiones anteriores del
JDK se mantiene por razones de compatibilidad.
39.1 El modelo de imágenes de modo inmediato y el BufferedImage

El modelo de imágenes en "modo inmediato" permite manipular y mostrar
imágenes de pixeles mapeados cuyos datos están almacenados en memoria. Es
posible acceder a los datos de la imagen en una gran variedad de formatos y usar
varios tipos de operaciones de filtrado para manipular los datos.
BufferedImage es la clase clave del API del modo-inmediato. Esta clase maneja
una imagen en memoria y proporciona métodos para almacenar, interpretar y
dibujar cada dato de pixel. Un BufferedImage puede ser renderizado en un contexto
Graphics o en un contexto Graphics2D.
Un BufferedImage es
esencialmente un Image con un
búfer de datos accesible. Un
BufferedImage tiene un
ColorModel y un Ráster de los
datos de la imagen. Figura 66 Clase BufferedImage (Sun Microsystems)
El ColorModel proporciona una interpretación de color de los datos de los píxeles

de la imagen. El Ráster representa las coordenadas rectangulares de la imagen,
mantiene los datos de la imagen en memoria, y proporciona un mecanismo para
crear múltiples subimagenes de un sólo búfer de imagen. El Ráster también
proporciona métodos para acceder a píxeles específicos dentro de la imagen.
39.2 Filtrado de un BufferedImage

El API Java 2D define varias operaciones de filtrado para objetos BufferedImage.
Cada operación de proceso de imágenes está incluida en una clase que
implementa la interfaz BufferedImageOp. La manipulación de imágenes se realiza
en el método filter. La clase BufferedImageOp en el API Java 2D soporta:
 Transformación afin
 Escalado
– UNAD
 Modificación de Aspecto
 Combinación Linear de Bandas
 Conversión de color
 Convolución.
Para filtrar un BufferedImage usando una de las clases de operación de imagense
debe:
1. Constuir una instancia de una de las clases BufferedImageOp:
AffineTransformOp, BandCombineOp, ColorConvertOp, ConvolveOp,
LookupOp , o RescaleOp.
2. Llamar al método de operación filter, pasando el BufferedImage que se
desea filtrar y el BufferedImage donde se quiere almacenar el resultado.
El siguiente ejemplo, tomado del Tutorial de Java 2D de Sun Microsystems ilustra
el uso de cuatro operaciones de filtrado de imagenes: low-pass, sharpen, lookup, y
rescale. Se hicieron algunas modificaciones, pues se presentaban errores al
cargar los archivos de imagen. El resultado de la ejecución es la pantalla que se
muestra en la Figura 67.
El filtro sharpen se realiza usando un ConvolveOp. Convolución es el proceso de

hacer más pesado el valor de cada pixel en una imagen con los valores de los
pixeles vecinos. La mayoría de los algoritmos de filtrado espacial están basados en
las operaciones de convolución.
Para construir y aplicar este tipo de filtrado al BufferedImage, este ejemplo usa un
código similar al del siguiente fragmento.
public static final float[] SHARPEN3x3 = {
0.f, -1.f, 0.f,
-1.f, 5.0f, -1.f,
0.f, -1.f, 0.f};

BufferedImage dstbimg = new BufferedImage(iw,ih,BufferedImage.TYPE_INT_RGB);
Kernel kernel = new Kernel(3,3,SHARPEN3x3);
ConvolveOp cop = new ConvolveOp(kernel, ConvolveOp.EDGE_NO_OP, null);
cop.filter(srcbimg,dstbimg);
– UNAD
Figura 67 Ejemplo de tratamiento de imágenes
El objeto Kernel define matemáticamente cómo se ve afectada la salida de cada

pixel en su área inmediata. La definición del Kernel determina el resultado del filtro.
El código completo de la aplicación, que contiene los cuatro filtros aplicados a las
imágenes es el siguiente:
/*
* Ejemplo de aplicación de filtros utilizando BufferedImage y BufferedImageOp.
* Versión modificada del ejemplo del Tutorial de Java 2D de Sun Microsystems.
*/
import java.awt.*;
import java.awt.image.*;
import java.awt.geom.AffineTransform;
import java.awt.font.TextLayout;
import java.awt.event.WindowEvent;
– UNAD
import java.awt.event.WindowListener;
import java.awt.event.WindowAdapter;
import java.applet.*;
import java.net.URL;
public class ImageOps extends Applet {
private BufferedImage vectorbi[];

public static final float[] SHARPEN3x3_3 = {
0.f, -1.f, 0.f,
-1.f, 5.f, -1.f,
0.f, -1.f, 0.f};

vectorbi = new BufferedImage[4];
String nombresimg[] = { "canocristales01.jpg", "canocristales01.jpg", "rioapaporis01.jpg",

"rioapaporis01.jpg"};
for ( int i = 0; i < vectorbi.length; i++ ) {
//Obtiene la imagen a partir del nombre de archivo correspondiente

Image imagen = Toolkit.getDefaultToolkit().getImage(nombresimg[i
/* El objeto MediaTracker, optimiza el proceso de cargado de la imagen al bloquear la tarea

hasta que
* la imagen esté totalmente cargada, con lo que se elimina el parpadeo que se produce al ir
* presentándose en la pantalla partes de esa imagen que no está totalmente cargada.
*/
try {
MediaTracker tracker = new MediaTracker(this);
tracker.addImage(imagen, 0);
tracker.waitForID(0);
}
catch ( Exception e ) { }
int iancho = imagen.getWidth(this);
int ialto = imagen.getHeight(this);
– UNAD
vectorbi[i] = new BufferedImage(iancho, ialto, BufferedImage.TYPE_INT_RGB);
//Crea un contexto gráfico a partir de la imagen

Graphics2D completa = vectorbi[i].createGraphics();
//Dibuja en el contexto la imagen
completa.drawImage(imagen,0,0,this);
}
}

g2.setRenderingHint(RenderingHints.KEY_RENDERING,
RenderingHints.VALUE_RÉNDER_QUALITY);
//Tamaño del applet para calcular los tamaños de imagen y sus posiciones
int anchoap = getSize().width;
int altoap = getSize().height;
g2.setColor(Color.black);
float[][] datos = {{0.1f, 0.1f, 0.1f, // Matriz del Filtro
0.1f, 0.2f, 0.1f,
0.1f, 0.1f, 0.1f},
SHARPEN3x3_3};
String Descrip[] = { "Convolve LowPass", "Convolve Sharpen",

"LookupOp", "RescaleOp"};
for ( int i = 0; i < vectorbi.length; i++ ) {
int iancho = vectorbi[i].getWidth(this);

int ialto = vectorbi[i].getHeight(this);
int x = 0, y = 0;
AffineTransform transformacion = new AffineTransform();

transformacion.scale((anchoap-14)/2.0/iancho, (altoap-34)/2.0/ialto);
BufferedImageOp bitrans = null;//BufferedImage donde quedará la modificada

BufferedImage bisrc = new BufferedImage(iancho,ialto,BufferedImage.TYPE_INT_RGB);
– UNAD
//BufferedImage srcinal
switch ( i ) {
case 0 :
case 1 : x = i==0?5:anchoap/2+3; y = 15;
Kernel kernel = new Kernel(3,3,datos[i
ConvolveOp cop = new ConvolveOp(kernel,

ConvolveOp.EDGE_NO_OP,
null);
cop.filter(vectorbi[i],bisrc);
bitrans = new AffineTransformOp(transformacion,
AffineTransformOp.TYPE_NEAREST_NEIGHBOR);
break;
case 2 : x = 5; y = altoap/2+15;
byte chlut[] = new byte[256];
for ( int j=0;j<200 ;j++ )
chlut[j]=(byte)(256-j);
ByteLookupTable blut=new ByteLookupTable(0,chlut);

LookupOp lop = new LookupOp(blut, null);
lop.filter(vectorbi[i],bisrc);
bitrans = new AffineTransformOp(transformacion,AffineTransformOp.TYPE_BILINEAR);
break;
case 3 : x = anchoap/2+3; y = altoap/2+15;
RescaleOp rop = new RescaleOp(1.1f,20.0f, null);
rop.filter(vectorbi[i],bisrc);
bitrans = new AffineTransformOp(transformacion,AffineTransformOp.TYPE_BILINEAR);
}
//Dibuja la imagen en el contexto gráfico en la correspondiente x e y.

g2.drawImage(bisrc,bitrans,x,y);
//Dubija el texto
TextLayout texto = new TextLayout(Descrip[i], g2.getFont(),g2.getFontRenderContext());
texto.draw(g2, (float) x, (float) y-4);
}
}

– UNAD
JFrame f = new JFrame("Tratamiento de imágenes");

});
Applet elapplet = new ImageOps();
f.getContentPane().add("Center", elapplet);
elapplet.init();
f.pack();
f.show();
}
}
Lección 40 Técnica de Doble Búfer

Cuando un gráfico es complejo o se usa repetidamente, se puede reducir el tiempo
que tarda en mostrarse renderizándolo primero en un búfer fuera de pantalla y
luego copiando el búfer en la pantalla. Esta técnica, llamada doble búfer, se usa
frecuentemente para animaciones.
Nota!!! Cuando dibujamos sobre un componente Swing, éste utiliza
automáticamente el doble búfer
Un BufferedImage puede usarse fácilmente como un búfer fuera de pantalla. Para
crear un BufferedImage cuyo espacio, color, profundidad y distribución de pixeles
corresponden exactamente a la ventana en la que serán dibujados, se llama al
método createImage del componente. Si se necesita un control sobre el tipo de la
imagen fuera de la pantalla
objeto BufferedImage o su
y usarlo transparencia,
como se puede
un búfer fuera construir directamente un
de pantalla.
Para dibujar dentro de una imagen almacenada, se llama al método
BufferedImage.createGraphics para obtener el objeto Graphics2D; luego se llama a
los métodos de dibujo apropiados del Graphics2D. Todo el API de dibujo de Java
2D puede usarse cuando se dibuja sobre un BufferedImage que está siendo
utilizado como un búfer fuera de pantalla.
– UNAD
Cuando esté listo para copiar el BufferedImage en la pantalla, simplemente se

llama al método drawImage sobre el contexto Graphics2D del componente y se le
pasa el BufferedImage.
El siguiente ejemplo permite al usuario arrastrar un rectángulo sobre la ventana del
applet. En lugar de dibujar el rectángulo en cada posición del cursor, para
proporcionar información al usuario, se usa un BufferedImage como búfer fuera de
la pantalla. Cuando se arrastra el rectángulo, es renderizado dentro del
BufferedImage en cada nueva posición y el BufferedImage se copia en la pantalla.
El ejemplo fue tomado del Tutorial de Sun Microsystems además de ilustrar el uso
del doble búfer le puede servir para ilustrar un posible proceso de animación. Lea
atentamente el código comentado.
Figura 68 Ejecución del ejemplo de doble búfer
import java.awt.*;
import java.applet.Applet;
import java.awt.image.*;
public class BufferedShapeMover extends Applet{
static protected Label lblTexto;
public void init(){

//Define la organización del applet
setLayout(new BorderLayout());
– UNAD
add(new BSMCanvas());
lblTexto = new Label("Arrastre el rectángulo dentro del área");
add("South", lblTexto);
}
Frame f = new Frame("Ejemplo de uso de doble búfer");

});
Applet applet = new BufferedShapeMover();
f.add("Center", applet);
applet.init();
f.pack();
f.show();
}
class BSMCanvas extends Canvas implements MouseListener, MouseMotionListener{
Rectangle rect = new Rectangle(0, 0, 100, 50);

BufferedImage bi;
Graphics2D contexto;
/* Toma las coordenas de la última vez que el usuario presiono el mouse y se ejecutó
* el evento mousePressed.
*/
int ult_x, ult_y;
boolean primeraVez = true;
TexturePaint texturaRelleno, texturaFilete;
Rectangle area;
/* Esta variable es True si el usuario dió clic o movio el mouse fuera del area del rectangulo,
* falso de lo contrario
*/
– UNAD
boolean estaFuera = false;
//Esta es la clase que define el fondo donde actua el rectángulo

public BSMCanvas(){
addMouseMotionListener(this);
addMouseListener(this);
// Crea el patrón para el relleno

bi = new BufferedImage(5, 5, BufferedImage.TYPE_INT_RGB);
contexto = bi.createGraphics();
contexto.setColor(Color.blue);
contexto.fillRect(0, 0, 7, 7);
contexto.setColor(Color.cyan);
contexto.fillOval(0, 0, 2, 2);
Rectangle r = new Rectangle(0,0,5,5);
texturaRelleno = new TexturePaint(bi, r);
contexto.dispose();
//Crea el patrón para el filete

bi = new BufferedImage(5, 5, BufferedImage.TYPE_INT_RGB);
contexto.setColor(Color.cyan);
contexto.fillRect(0, 0, 7, 7);
contexto.setColor(Color.blue);
contexto.fillOval(0, 0, 2, 2);
r = new Rectangle(0,0,5,5);
texturaFilete = new TexturePaint(bi, r);
contexto.dispose();
}
// Maneja el evento cuando se ha dado clic a un botón del mouse.

public void mousePressed(MouseEvent e){
ult_x = rect.x - e.getX();

ult_y = rect.y - e.getY();
– UNAD
// Chequea si el usuario dio clic dentro del rectangulo y se mantiene allí

if(rect.contains(e.getX(), e.getY())){
updateLocation(e);
} else {
BufferedShapeMover.lblTexto.setText("Posicione el cursor en el rectángulo y luego
arrastre");
estaFuera = true;
}
}
// Maneja el evento cuando el usuario arrastra el mouse miesntras mantiene presionado el botón.
public void mouseDragged(MouseEvent e){
if(!estaFuera){
updateLocation(e);
} else {
arrastre");
}
}
// Maneja el evento cuando el usuario suelta el boton del mouse

public void mouseReleased(MouseEvent e){
/* Chequea si el cursor está dentro del rectángulo cuando el usuario suelta el botón del mouse
* e.getX y e.getY proporcionan las coordenadas donde se soltó el botón
*/
if(rect.contains(e.getX(), e.getY())){
updateLocation(e);
} else {
arrastre");
estaFuera = false;
}
}
// Este método es requerido por el MouseListener, no se implementa.

– UNAD
public void mouseMoved(MouseEvent e){}
// Estos métodos son requeridos por el MouseMotionListener no se implementa.

public void mouseClicked(MouseEvent e){}
public void mouseExited(MouseEvent e){}
public void mouseEntered(MouseEvent e){}
// Este método es el que actualiza la localización del rectángulo

public void updateLocation(MouseEvent e){
rect.setLocation(ult_x + e.getX(), ult_y + e.getY());
/* Si el método chequearRect retorna verdadero actualiza el contenido del texto para que
* muestre la localización actual del rectángulo, de lo contrario muestr un mensaje
*/
if (chequearRect()) {
BufferedShapeMover.lblTexto.setText("Rectángulo localizado en " +
rect.getX() + ", " +

rect.getY());
} else {
BufferedShapeMover.lblTexto.setText("Por favor no intente arrastrar el rectángulo"+
" fuera del área");
}
repaint();
}
public void paint(Graphics g){

update(g);
public void update(Graphics g){

Graphics2D g2 = (Graphics2D)g;
if(primeraVez){
Dimension dim = getSize();
int ancho = dim.width;
int alto = dim.height;
– UNAD
area = new Rectangle(dim);

bi = (BufferedImage)createImage(ancho, alto);
rect.setLocation(ancho/2-50, alto/2-25);
contexto.setStroke(new BasicStroke(10.0f));
primeraVez = false;
// Pone en blanco el rectángulo que se dibujó con anterioridad

contexto.setColor(Color.white);
contexto.clearRect(0, 0, area.width, area.height);
// Dibuja y rellena el rectángulo en la nueva posición del búfer

contexto.setPaint(texturaFilete);
contexto.draw(rect);
contexto.setPaint(texturaRelleno);
contexto.fill(rect);
// Dibuja la imagen del búfer en la pantalla.

g2.drawImage(bi, 0, 0, this);
}
/* Esta función chequea si el rectángulo se encuentra dentro de la ventana del applet.

* Si no se encuentra dentro del applet, el se redibuja de forma que quede al lado del
* margen de la ventana.
*/
boolean chequearRect(){
if (area == null) {
return false;
}
if(area.contains(rect.x, rect.y, 100, 50)){
return true;
}
int nuevo_x = rect.x;
int nuevo_y = rect.y;
– UNAD
if((rect.x+100)>area.width){
nuevo_x = area.width-99;
}
if(rect.x < 0){
nuevo_x = -1;
}
if((rect.y+50)>area.height){
nuevo_y = area.height-49;
}
if(rect.y < 0){
nuevo_y = -1;
}
rect.setLocation(nuevo_x, nuevo_y);
return false;
}
CAPÍTULO 9 API 3D de JAVA
A continuación se presenta un tutorial introductorio al API 3D de Java, tomado de

la traducción realizada por Juan Antonio Palos al Tutorial de Sun Microsystems.
Sólo contempla la etapa de reconocimiento del modelamiento inicial con el API 3D
de Java, se espera que el estudiante profundice su estudio a partir de sus
necesidades e intereses individuales.
El API Java 3D es un interface para escribir programas que muestran e interactúan
con gráficos tridimensionales. Java 3D es una extensión estándar del JDK 2 de
Java.
crear yElmanipular
API Java 3D proporciona
geometrías 3D una colección para
y estructuras de constructores
dibujar estade alto-nivel Java
geometría. para
3D proporciona las funciones para creación de imágenes, visualizaciones,
animaciones y programas de aplicaciones gráficas 3D interactivas.
– UNAD
Lección 41 Lo básico de Java 3D

El API 3D de Java es un árbol de clases Java que sirven como interfaz para
sistemas de renderizado de gráficos tridimensionales y un sistema de sonido. El
programador trabaja con constructores de alto nivel para crear y manipular objetos
geométricos en 3D. Estos objetos geométricos residen en un universo virtual, que
luego es renderizado. El API está diseñado con flexibilidad para crear universos
virtuales precisos de una ámplia variedad de tamaños, desde astronómicos a
subatómicos.
A pesar de toda esta funcionalidad, el API es sencillo de usar. Los detalles de
renderizado se manejan automáticamente. Aprovechándose de los Threads Java,
el renderizador Java 3D es capaz de renderizar en paralelo. El renderizador
también puede optimizarse automáticamente para mejorar el rendimiento del
renderizado.
Un programa Java 3D crea ejemplares de objetos Java 3D y los sitúa en un
estructura de datos de escenario gráfico. Este escenario gráfico es una
composición de objetos 3D en una estructura de árbol que especifica
completamente el contenido de un universo virtual, y cómo va a ser renderizado.
Los programas Java 3D pueden escribirse para ser ejecutados como aplicaciones
solitarias o como applets en navegadores que hayan sido extendidos para soportar
Java 3D, o ámbos.
Lección 42 Empezar con Java 3D

Todo programa Java 3D está, al menos parcialmente, ensamblado por objetos del
árbol de clases Java 3D. Esta colección de objetos describe un universo virtual,
que va a ser renderizado. El API define unas 100 clases presentadas en el paquete
javax.media.j3d.
Hay cientos de campos y métodos en las clases del API Java 3D. Sin embargo, un
sencillo universo virtual que incluya animación puede construirse con unas pocas
clases. Esta sección describe un conjunto mínimo de objetos y sus interacciones
para renderizar un universo virtual.
Esta sección incluye el desarrollo de un sencillo pero completo programa Java 3D,
llamado HelloJava3Dd.java, que muestra un cubo giratorio. El programa de ejemplo
se desarrolla de forma incremental, y se presenta en varias versiones, para
demostrar cada parte del proceso de programación Java 3D.
– UNAD
Además del paquete corazón de Java 3D, se usan otros paquetes para escribir
programas Java 3D. Uno de estos paquetes es com.sun.j3d.utils al que
normalmente se hace referencia como clases de utilidades de Java 3D. El paquete
de las clases corazón incluye sólo las clases de menor nivel necesarias en la
programación Java 3D.
Las clases de utilidades son adiciones convenientes y poderosas al corazón. Estas
clases se dividen en cuatro categorías: cargadores de contenidos, ayudas a la
construcción del escenario gráfico, clases de geometría y utilidades de
conveniencia.
Al utilizar las clases de utilidades se reduce significativamente el número de líneas
de código en un programa Java 3D. Además de las clases de los paquetes corazón
y de utilidades de Java 3D, todo programa 3D usa clases de los paquetes java.awt
y javax.vecmath.
En el resto del texto, el término objeto visual se utilizará para hacer referencia a un
"objeto del escenario gráfico" (por ejemplo, un cubo o una esfera). El término objeto
sólo se usará para referirse a un ejemplar de una clase. El término contenido se
usará para referirnos a objetos visuales en un escenario gráfico como un todo.
42.1 Construir un Escenario Gráfico

Un universo virtual Java 3D se crea desde un escenario gráfico. Un escenario
gráfico se crea usando ejemplares de clases Java 3D. El escenario gráfico está
ensamblado desde objetos que definen la geometría, los sonidos, las luces, la
localización, la orientación y la apariencia de los objetos visuales y sonoros.
Una definición común de un escenario gráfico es una estructura de datos
compuesta de nodos y arcos. Un nodo es un elemento dato y un arco es una
relación entre elementos datos. Los nodos en un escenario gráfico son los
ejemplares de lasJava
entre ejemplares clases
3D.Java 3D. Los arcos representan dos tipos de relaciones
La relación más común es padre-hijo. Un nodo Group puede tener cualquier
número de hijos, pero sólo un padre. Un nodo hoja sólo puede tener un padre y no
puede tener hijos. La otra relación es una referencia. Una referencia asocia un
objeto NodeComponent con un nodo del escenario gráfico. Los objetos
NodeComponent definen la geometría y los atributos de apariencia usados para
renderizar los objetos visuales.
– UNAD
Un escenario gráfico Java 3D está construido de objetos nodos con relaciones

padre-hijo formando una estructura de árbol. En una estructura de árbol, un nodo
es el raíz. Se puede acceder a otros nodos siguiendo los arcos desde el raíz. Los
nodos de un árbol no forman bucles. Un escenario gráfico está formado desde los
árboles con raíces en los objetos Locale. Los NodeComponents y las referencias a
arcos no forman parte del escenario gráfico.
Sólo existe un camino desde la raíz de un árbol a cada una de las hojas; por lo
tanto, sólo hay un camino desde la raíz hasta el escenario gráfico de cada nodo
hoja. El camino desde la raíz de un escenario gráfico hasta una hoja especificada
es el camino al escenario gráfico del nodo hoja. Como un camino de un escenario
gráfico trata exactamente con un sola hoja, hay un camino de escenario gráfico
para cada hoja en el escenario.
Todo camino de escenario gráfico en un escenario gráfico Java 3D especifica
completamente la información de estado de su hoja. Esta información incluye, la
localización, la orientación y el tamaño del objeto visual. Consecuentemente, los
atributos visuales de cada objeto visual dependen sólo de su camino de escenario
gráfico. El renderizador Java 3D se aprovecha de este hecho y renderiza las hojas
en el orden
no tiene quesobre
control él determina
el ordenmás eficiente. Elde
de renderizado programador
los objetos. Java 3D normalmente
Las representaciones gráficas de un escenario gráfico pueden servir como
herramienta de diseño y/o documentación para los programas Java 3D. Los
escenarios gráficos se dibujan usando símbolos gráficos estándar como se ve en la
Figura 69. Los programas Java 3D podrían tener más objetos que los que hay en
su escenario gráfico.
Para diseñar un universo virtual Java 3D se dibuja un escenario gráfico usando un
conjunto de símbolos estándar. Después de completar el diseño, este escenario
gráfico es la especificación para el programa. Después de completar el programa,
el mismo escenario gráfico es una representación concisa del programa
(asumiendo que se siguió la especificación).
– UNAD
Figura 69 Notación utilizada para la representación de un escenario gráfico
Cada uno de los símbolos mostrados al lado izquierdo de la Figura 69 representa

un sólo objeto cuando se usa en un escenario gráfico. Los dos primeros símbolos
representan objetos de clases específicas: VirtualUniverse y Locale. Lo siguientes
tres símbolos de la izquierda representan objetos de las clases Group, Leaf, y
NodeComponent. Estos tres símbolos normalmente tienen anotaciones para indicar
la subclase del objeto específico. El último símbolo se usa para representar otras
clases de objetos.
El símbolo de la flecha sólida representa una relación padre-hijo entre dos objetos.
La flecha punteada es una referencia a otro objeto. Los objetos referenciados
pueden ser compartidos entre diferentes ramas de un escenario gráfico. En la
Figura 70, se puede observar un sencillo escenario gráfico.
– UNAD
Figura 70 Ejemplo de escenario gráfico
Es posible crear un escenario gráfico ilegal. Se puede ver uno en la Figura 71. Este
escenario es ilegal porque viola las propiedades de un DAG. El problema son los
dos objetos TransformGroup(TG) que tienen al mismo objeto Shape3D como hijo.
Recuerda que una hoja sólo puede tener un padre. En otras palabras, sólo puede
haber un camino desde el objeto Locale hasta la hoja (o un camino desde la hoja
hasta el objeto Locale).
Figura 71 Ejemplo de escenario gráfico ilegal

– UNAD
Es posible pensar que la estructura mostrada en la Figura 71 define tres objetos

visuales en un universo virtual. Pero el escenario gráfico define dos objetos
visuales que re-usan el objeto visual (Shape3D) del lado derecho de la figura.
Conceptualmente, cada objeto TransformGroup que apadrina al ejemplar
compartido de Shape3D podría situar una imagen en el objeto visual en diferentes
localizaciones. Sin embargo, es un escenario gráfico ilegal porque el arco padre-
hijo no forma un árbol. En este ejemplo, el resultado es que el objeto Shape3D
tiene más de un padre.
Las explicaciones del árbol y de las estructuras DAG son correctas. Sin embargo,
el sistema de ejecución Java 3D reporta el error en términos de la relación hijo-
padre. Un resultado de la limitación de la estructura de árbol es que cada objeto
Shape3D está limitado a un sólo padre. Para el ejemplo de la Figura 61, se lanzará
una excepción 'multiple parent' en el momento de la ejecución. La Figura 72, con
un padre para cada objeto Shape3D, muestra una posible solución para este
escenario gráfico.
Figura 72 Posible solución al escenario gráfico ilegal

Cada escenario gráfico tiene un sólo VirtualUniverse. Este objeto tiene una lista de
objetos Locale. Un objeto Locale proporciona una referencia a un punto en el
universo virtual. Se puede pensar en los objetos Locale como marcas de tierra que
determinan la localización de los objetos visuales en el universo virtual.
Es técnicamente posible para un programa Java 3D tener más de un objeto
VirtualUniverse, y así definir más de un universo virtual. Sin embargo, no hay
ninguna forma de comunicación entre los universos virtuales. Además, un objeto de
– UNAD
un escenario gráfico no puede existir en más de un universo virtual. Es altamente

recomendable usar uno y sólo un ejemplar de VirtualUniverse en cada programa
Java 3D.
Mientras que un objeto VirtualUniverse podría referenciar muchos objetos Locale,
la mayoría de los programas Java 3D tiene un sólo objeto Locale. Cada
objetoLocale puede servir de raíz para varios sub-gráficos del escenario gráfico.
Por ejemplo, si se hace referencia a la Figura 70 se podrá observar las dos ramas
sub-gráficas que salen desde el objeto Locale.
Un objeto BranchGroup es la raíz de un sub-gráfico, o rama gráfica. Hay dos
categorias de escenarios sub-gráficos: la rama de vista gráfica y la rama de
contenido gráfico. La rama de contenido gráfico especifica el contenido del universo
virtual - geometría, apariencia, comportamiento, localización, sonidos y luces. La
rama de vista gráfica especifica los parámetros de visualización, como la posición
de visualización y la dirección. Juntas, las dos ramas especifican la mayoría del
trabajo que el renderizador tiene que hacer.
42.2 Árbol de Clases de Alto Nivel del API Java 3D

En la Figura 73 se pueden ver los tres primeros niveles del árbol de clases del API
Java 3D. En esta parte del árbol aparecen las clases VirtualUniverse, Locale,
Group, y Leaf.
– UNAD
Figura 73 Árbol de clases del API Java 3D
SceneGraphObject es la superclase de casi todas las clases corazón y de utilidad

de Java 3D. Tiene dos subclases: Node y NodeComponent. Las subclases de
Node proporcionan la mayoría de los objetos de un escenario gráfico. Un objeto
Node es un objeto nodo Group o un objeto nodo Leaf.
Clase Node
La clase Node es una superclase abstracta de las clases Group y Leaf. Esta clase
define algunos de los métodos importantes de sus subclases. Las subclases de
Node componen escenarios gráficos.
Clase Group
La clase Group es la superclase usada en especificación de localización y
orientación de objetos visuales en el universo virtual. Dos de las subclases de
– UNAD
Group son: BranchGroup y TransformGroup. En la representación gráfica de un

escenario gráfico, los simbolos de Group (círculos) normalmente se anotan con BG
para BranchGroups, TG para TransformGroups, etc. La Figura 70 muestra algunos
ejemplos de esto.
Clase Leaf
La clase Leaf esdelalossuperclase

comportamiento usada para
objetos visuales en elespecificar la forma,
universo virtual. el sonido
Algunas de lasy
subclases de Leaf son: Shape3D, Light, Behavior, y Sound. Estos objetos podrían
no tener hijos pero podrían referenciar a NodeComponents.
Clase NodeComponent
La clase NodeComponent es la superclase usada para especificar la geometría, la
apariencia, la textura y las propiedades de material de un nodo Shape3D (Leaf).
Los NodeComponents no forman parte del escenario gráfico, pero son
referenciados por él. Un NodeComponent podría ser referenciado por más de un
objeto Shape3D.
42.3 Receta para Escribir Programas Java 3D

Las subclases de SceneGraphObject son los ladrillos que se ensamblan en los
escenarios gráficos. La línea básica de desarrollo de un programa Java 3D consiste
en siete pasos (a los que la especificación del API Java 3D se referiere como un
Receta) presentados a continuación. Esta receta puede usarse para ensamblar
muchos programas útiles de Java 3D.
1. Crear un Objeto Canvas3D
2. Crear un objeto VirtualUniverse
3. Crear un objeto Locale, adjuntarlo al objeto VirtualUniverse
4. Construir la rama de vista gráfica
5. Crear un objeto View
6. Crear un objeto ViewPlatform
7. Crear un objeto PhysicalBody
8. Crear un objeto PhysicalEnvironment
9. Adjuntar los objetos ViewPlatform, PhysicalBody, PhysicalEnvironment, y
Canvas3D al objeto View
10. Construir la(s) rama(s) gráfica(s) de contenido
11. Compilar la(s) rama(s) gráfica(s)
12. Insertar los subgráficos dentro del objeto Locale
– UNAD
Esta receta ignora algunos detalles pero ilustra el concepto fundamental para toda
la programación Java 3D: crear la rama gráfica del escenario gráfico es la
programación principal. En vez de ampliar esta receta, los siguientes párrafos
explican una forma sencilla de construir un escenario gráfico muy similar con
menos programación.
Los programas Java 3D escritos usando la receta básica tienen ramas de vista
gráfica con idéntica estructura. La regularidad de la estructura de las ramas de vista
gráfica tambien se encuentra en la clase de utilidad SimpleUniverse. Los
ejemplares de esta clase realizan los pasos 2, 3 y 4 de la receta básica. Usando la
clase SimpleUniverse en programación Java 3D se reduce significativamente el
tiempo y el esfuerzo necesario para crear las ramas de vista gráfica.
Consecuentemente, el programador tiene más tiempo para concentrarse en el
contenido. Esto es de lo que se trata el escribir programas Java 3D.
La clase SimpleUniverse es un buen punto de inicio en la programación Java 3D,
porque permite al programador ignorar las ramas de vista gráfica. Sin embargo,
usar SimpleUniverse no permite tener varias vistas de un universo virtual.
La clase SimpleUniverse se usa en todos los ejemplos de programación de este
tutorial.
La clase SimpleUniverse
El constructor de SimpleUniverse crea un escenario gráfico que incluye un objeto
VirtualUniverse y Locale, y una rama de vista gráfica completa. Esta rama gráfica
creada usa un ejemplar de las clases de conveniencia ViewingPlatform y Viewer en
lugar de las clases corazón usadas para crear una rama de vista gráfica. Observe
que SimpleUniverse sólo usa indirectamente los objetos View y ViewPlatform del
corazón Java 3D. Los objetos SimpleUniverse suministran la funcionalidad de todos
los objetos que hay dentro del recuadro azul de la Figura 74.
– UNAD
Figura 74 Universo virtual mínimo proporcionado por la clase SimpleUniverse (en azul)
El paquete com.sun.j3d.utils.universe contiene SimpleUniverse, ViewingPlatform, y

clases Viewer de conveniencia.
Al usar los objetos SimpleUniverse la receta básica se simplifica:

1. Crear un objeto Canvas3D
2. Crear un objeto SimpleUniverse que referencia al objeto Canvas3D
anterior
3. Personalizar el objeto SimpleUniverse
4. Construir la rama de contenido
5. Compilar la rama de contenido gráfico
6. Insertar la rama de contenido gráfico dentro del objeto Locale de
SimpleUniverse
Constructores de SimpleUniverse
Paquete: com.sun.j3d.utils.universe
Esta clase configura un entorno de usuario mínimo para obtener rápida y fácilmente
un programa Java 3D y ejecutarlo.
Esta clase de utilidad crea todos los objetos necesarios para la rama de vista
gráfica. Especificamente crea los objetos Locale, VirtualUniverse, ViewingPlatform,
y Viewer (todos con sus valores por defecto). Los objetos tiene las relaciones
apropiadas para formar la rama de vista gráfica.
– UNAD
SimpleUniverse proporciona toda la funcionalidad necesaria para muchas

aplicaciones Java 3D básicas. Viewer y ViewingPlatform son clases de
conveniencia. estas clases usan las clases View y ViewPlatform del corazón Java.
SimpleUniverse() Construye un sencillo universo virtual.
SimpleUniverse(Canvas3D canvas3D) Construye un sencillo universo
virtual con una referencia al objeto Canvas3D nombrado.

El objeto SimpleUniverse crea una rama de vista gráfica completa para un universo
virtual. Esta rama incluye un plato de imagen. Un plato de imagen es el rectángulo
conceptual donde se proyecta el contenido para formar la imagen renderizada. El
objeto Canvas3D, que proporciona una imagen en una ventana de nuestra pantalla,
puede ser el plato de imagen.
La Figura 75 muestra la relación entre el plato de imagen, la posición del ojo, y el
universo virtual. La posición del ojo está detrás del plato de imagen. Los objetos
visuales delante del plato de imagen son renderizados en el plato de imagen. El
renderizado puede ser como una proyección de los objetos visuales sobre el plato
de imagen. Esta idea se ilustra con los cuatro proyectores de la imagen (líneas
punteadas).
Figura 75 Representación del Plato de imagen y el ojo visor en el universo virtual
Por defecto, el plato de imagen está centrado en el srcen de SimpleUniverse. La

orientación por defecto es mirando hacia abajo el eje Z. Desde esta posición, el eje
X es una línea horizontal que atraviesa el plato de imagen con los valores positivos
hacia la derecha. El eje Y es una línea vertical que atraviesa el centro del plato de
imagen, con los valores positivos arriba. Consecuentemente, el punto (0,0,0) es el
centro del plato de imagen.
– UNAD
Los típicos programas Java 3D mueven la vista hacía atrás (z positivo) para hacer
que los objetos se acerquen, al srcen dentro de la vista. La clase SimpleUniverse
tiene un miembro que es un objeto de la clase ViewingPlatform. Esta clase tiene un
método setNominalViewingTransform que selecciona la posición del ojo para que
esté centrado en (0, 0, 2.41) buscando en dirección z negativa hacia el srcen.
El Método ViewingPlatform setNominalViewingTransform()

Paquete: com.sun.j3d.utils.universe
La clase ViewingPlatform se usa para configurar la rama de vista gráfica de un
escenario gráfico Java 3D en un objeto SimpleUniverse. Este método normalmente
se usa en conjunción con el método getViewingPlatform de la clase
SimpleUniverse.
void se tNominalViewingTransform()
Selecciona la distancia nominal de la vista a una distancia de aproximadamente
2,42 metros en la vista de transformación de un SimpleUniverse. Desde esta
distancia y con el campo de vista por defecto, los objetos con 2 metros de altura o
de anchura generalmente entran en el plato de imagen.
Después de crear los objetos Canvas3D y SimpleUniverse, el siguiente paso es la
creacción de la rama de contenido gráfico. La regularidad de estructura encontrada
en la rama de vista gráfica no existe para la rama de contenido gráfico. La rama de
contenido varía de un programa a otro haciendo imposible obtener los detalles de
su construcción en una receta. Esto también significa que no hay una clase de
"contenido sencillo" para ningún universo que podamos querer ensamblar.
Después de crear la rama de contenido gráfico, se inserta dentro del universo
usando el método addBranchGraph de SimpleUniverse. Este método toma un
ejemplar de BranchGroup como único argumento. Este BranchGroup se añade
como hijo del objeto Locale creado por SimpleUniverse.
Algunos de los métodos de SimpleUniverse correspondiente al paquete:
com.sun.j3d.utils.universe, se muestran a continuación:
void addBranchGraph(BranchGroup bg) Se usa para añadir Nodos al objeto
Locale del escenario gráfico creado por el SimpleUniverse. Se usa para añadir una
rama de contenido gráfico al universo virtual.
– UNAD
ViewingPlatform getViewingPlatform() Se usa para recuperar el objeto

ViewingPlatform del SimpleUniverse ejemplarizado. Este método se usa con el
método setNominalViewingTransform() de ViewingPlatform para ajustar la
localización de la posición de vista.
42.4 Alguna Terminología Java 3D

Insertar una rama gráfica dentro de un Locale la hace viva, y consecuentemente,
cada uno de los objetos de esa rama gráfica también están vivos. Hay algunas
consecuencias cuando un objeto se convierte en vivo. Los objetos vivos estan
sujetos a renderización. Los parámetros de los objetos vivos no pueden ser
modificados a menos que la capacidad correspondiente haya sido seleccionada
especificamente antes de que el objeto esté vivo.
Los objetos BranchGroup pueden ser compilados. Compilar un BranchGroup lo
convierte a él y a todos sus ancestros en una forma más eficiente para el
renderizado. Compilar los objetos BranchGroup está recomendado como el
último paso antes de hacerlo vivir . Es mejor compilar solo los objetos
BranchGroup insertados dentro de objetos Locale
El método BranchGroup compile() compila la fuente BranchGroup asociada con
este objeto creado y coloca en memoria caché el escenario gráfico compilado.
Los conceptos de compilado y vivo se implementan en la clase
SceneGraphObject. Abajo se pueden ver los dos métodos de la clase
SceneGraphObject que se relacionan con estos conceptos.
SceneGraphObject es la superclase usada para crear un escenario gráfico
incluyendo Group, Leaf, y NodeComponent. SceneGraphObject proporciona varios
métodos y campos comunes para sus subclases:
boolean isCompiled() Devuelve una bandera indicando si el nodo forma parte
de un escenario gráfico que ha sido compilado.
boolean isLive() Devuelve una bandera que indica si el nodo forma parte de un
escenario gráfico vivo.
Observe que no hay un paso "Empezar a renderizar" en ninguna de las recetas
anteriores. El renderizador Java 3D empieza a funcionar en un bucle infinito cuando
una rama gráfica que contiene un ejemplar de View se vuelve vivo en un universo
virtual. Una vez arrancado, el renderizador Java 3D realiza las operaciones
mostradas en el siguiente listado:
– UNAD
while(true) {
Procesos de entrada
If (petición de salida) break
Realiza comportamientos
Atraviesa el escenario gráfico
y renderiza los objetos visuales
}
Limpieza y salida
Las secciones anteriores explicaban la construcción de un sencillo universo virtual

sin una rama de contenido gráfico. La creacción de esta rama es el objetivo de las
siguientes secciones.
Lección 43 Un Ejemplo de la aplicación de la receta

El programa Java 3D típico empieza definiendo una nueva clase que extiende la
clase
clase Applet.
Applet. El
Losejemplo HelloJava3Da.java
programas es una
Java 3D podrían clase definida
escribirse para extender
como aplicaciones, la
pero
usar applets ofrece una forma más sencilla de producir una aplicación con
ventanas.
La clase principal de un programa Java 3D normalmente define un método para
construir la rama de contenido gráfico. En el ejemplo HelloJava3Da dicho método
está definido como createSceneGraph(). Los pasos de la receta sencilla se
implementan en el constructor de la clase HelloJava3Da, que se muestra en la
Figura 76.
– UNAD
Figura 76 Fragmento del código de HelloJava3Da.java
El paso 1, crear un objeto Canvas3D, se completa en la línea 23.

El paso 2, crear un objeto SimpleUniverse, se hace en la línea 31.
El paso 2a, personalizar el objeto SimpleUniverse, se realiza en la línea 35.
El paso 3, construir la rama de contenido, se realiza en la llamada al método
createSceneGraph() de la línea 27.
El paso 4, compilar la rama de contenido gráfico, se hace en la línea 28.
Finalmente el paso 5, insertar la rama de contenido gráfico en el objeto Locale del
SimpleUniverse, se completa en la línea 37.
El paso 3 de esta sencilla receta es crear la rama de contenido gráfico. Esta rama
se crea en el fragmento de código que se muestra en la Figura 77.
Probablemente sea la rama de
contenido gráfico más sencilla
posible. Contiene un objeto gráfico
estático, un ColorCube que se
observa en la línea 45. Éste está
localizado en el srcen del sistema de
coordenadas del universo virtual, el
Figura 77 Fragmento para la creación de la rama valor del lado del cubo es de 0.4,
de contenido gráfico
considerando que el tamaño total del
applet es 1.0.
La clase HelloJava3Da está derivada de Applet pero el programa puede ejecutarse

como una aplicación con el uso de la clase MainFrame. La clase Applet se usa
como clase base para hacer más fácil la escritura de un programa Java 3D que se
– UNAD
ejecuta en una ventana. MainFrame proporciona un marco AWT (ventana) para un

applet permitiendo que el applet se ejecute como una aplicación.
El tamaño de la ventana de la
aplicación resultante se
especifica en la construcción
de la clase MainFrame. Figura 78 Método main que crea la ventana invocando
MainFrame
Los tres fragmentos de código anteriores (Figura 76, Figura 77 y Figura 78) forman
un programa Java 3D completo cuando se usan las sentencias import adecuadas.
A continuación se pueden ver las sentencias import necesarias para compilar la
clase HelloJava3Da. Las clases más comunmente usadas en Java 3D se
encuentran en los paquetes javax.media.j3d, o javax.vecmath.
En este ejemplo, sólo la clase de

utilidad ColorCube se encuentra en el
paquete com.sun.j3d.utils.geometry.
La mayoría de los programas Java 3D
tienen las sentencias import mostradas
Figura 79 Sentencias import para
HelloJava3Da.java en el fragmento de la Figura 79.
En el programa de ejemplo HelloJava3Da.java, sólo se sitúo un objeto gráfico en

una única localización. En la Figura 80 se observa el escenario gráfico resultante:
Figura 80 Escenario gráfico de HelloJava3Da.java

– UNAD
La imagen que proporciona la ejecución del código completo se muestra en la

Figura 81.
Figura 81 Ejecución de HelloJava3Da.java
Como no se explica cada línea de código del ejemplo HelloJava3Da, las ideas
básicas de ensamblar un programa Java 3D deberían estar claras habiendo leído el
ejemplo. La siguiente sección presenta cada una de las clases usadas en el
programa.
43.1 Clases Java 3D Usadas en HelloJava3Da

Para añadir un poco de entendimiento del API Java 3D y el ejemplo HelloJava3Da
aquí se presenta una síntesis de las clases del API Java 3D usadas en
HelloJava3Da.
Clase BranchGroup
Los objetos de este tipo se usan para formar escenarios gráficos. Los ejemplares
de BranchGroup
únicos son ser
que pueden la raíz de de
hijos los los
sub-gráficos. Los objetos
objetos Locale. BranchGroup
Los objetos son los
BranchGroup
pueden tener varios hijos. Los hijos de un objeto BranchGroup pueden ser otros
objetos Group o Leaf.
El constructor por defecto de BranchGroup es:
BranchGroup() Los ejemplares de BranchGroup sirven como raíz para las
ramas del escenario gráfico; los objetos BranchGroup son los únicos objetos que
pueden insertarse en un conjunto de objetos Locale.
– UNAD
Clase Canvas3D
La clase Canvas3D deriva de la clase Canvas del AWT. Por lo menos un objeto
Canvas3D debe ser referenciado en la rama de vista gráfica del escenario gráfico.
El constructor de Canvas3D es:
Canvas3D(GraphicsConfiguration graphicsconfiguration) Construye e
inicializa un nuevo objeto Canvas3D que el Java 3D puede renderizar dando un
objeto GraphicsConfiguration válido. Es una extensión de la clase Canvas del AWT.
Clase Transform3D
Los objetos Transform3D representan transformaciones de geometrías 3D como
una traslación o una rotación. Estos objetos normalmente sólo se usan en la
creacción de un objeto TransformGroup. Primero, se construye el objeto
Transform3D, posiblemente desde una combinación de objetos Transform3D.
Luego se construye el objeto TransformGroup usando el objeto Transform3D.
Un objeto
matriz de doubles
de 4x4 transformación generalizado
de punto flotante. La se representa internamente
representación como
matemática es una
la mejor
forma. Un objeto Transform3D no se usa en un escenario gráfico. Se usa para
especificar la transformación de un objeto TransformGroup.
El constructor por defecto de Transform3D
Transform3D() Construye un objeto Transform3D que representa la matriz de
identidad (no la transformación).
Un objeto Transform3D puede representar una traslación, una rotación, un
escalado, o una combinación de éstas. Cuando se especifica una rotación, el
ángulo se expresa en radianes. Una rotación completa es 2 PI radianes. Una forma
de especificar
valores ángulos Algunas
directamente. es usar la constante Math.PI.
aproximaciones Otraesforma
son: 45º es 90º
0.785, especificar
es 1.57,losy
180º es 3.14.
A continuación se presenta una lista parcial de métodos de Transform3D
void rotX(double angle) Selecciona el valor de esta transformación a una
rotación en contra del sentido del reloj sobre el eje-x. El ángulo se especifica en
radianes.
– UNAD
void rotY(double angle) Selecciona el valor de esta transformación a una

rotación en contra del sentido del reloj sobre el eje-y. El ángulo se especifica en
radianes.
void rotZ(double angle) Selecciona el valor de esta transformación a una
rotación en contra del sentido del reloj sobre el eje-z. El ángulo se especifica en
radianes.
void set(Vector3f translate) Selecciona el valor transacional de esta matriz al
valor del parámetro Vector3f, y selecciona los otros componentes de la matriz como
si ésta transformación fuera una matriz idéntica.
Clase TransformGroup
Como una subclase de la clase Group, los ejemplares de TransformGroup se usan
en la creacción de escenarios gráficos y tienen una colección de objetos nodos
como hijos. Los objetos TransformGroup contienen transformaciones geométricas
como traslaciones y rotaciones. La transformación normalmente se crea en un
objeto Transform3D, que no es un objeto del escenario gráfico.
Los contructores de TransformGroup son:
TransformGroup() Construye e inicializa un TransformGroup usando una identidad
de transformación.
TransformGroup(Transform3D t1) Construye e inicializa un TransformGroup
desde un objeto Transform3D t1 pasado como parámetro.
La transformación contenida en un objeto Transform3D se copia a un objeto
TransformGroup o cuando se crea el TransformGroup, o usando el método
setTransform(). Así:
voideste
de setTransform(Transform3D Selecciona
t1) valor
TransformGroup a partir del de deellacomponente de transformación
transformación pasada en el
parámetro t1.
Clase Vector3f
Vector3f es una clase matemática que se encuentra en el paquete javax.vecmath
para especificar un vector usando tres valores de punto flotante para las
coordenadas x, y, e z. Los objetos Vector se usan frecuentemente para
– UNAD
especificar traslaciones de geometrías . Los objetos Vector3f no se usan

directamente en la construcción de un escenario gráfico. Se usan para especificar
las traslaciones, superficies normales, u otras cosas.
A continuación se muestran los constructores de Vector3f
Vector3f() Construye e inicializa un Vector3f a (0,0,0).
Vector3f(float x, float y, float z)Construye e inicializa un Vector3f desde las

coordenadas x, y, z especificadas.
Clase ColorCube
ColorCube es una clase de utilidad que se encuentra en el paquete
com.sun.j3d.utils.geometry que define la geometría y colores de un cubo
centrado en el srcen y con diferentes colores en cada cara, ColorCube extiende la
clase Shape3D, por lo tanto, es un nodo hoja. Si un cubo sin rotar se sitúa en el
srcen (como en HelloJava3Da), se verá la cara roja desde la localización de visión
nominal. Los otros colores son azul, magenta, amarillo, verde y cian.
Los coonstructores de ColorCube son:
ColorCube() Construye un cubo de color del tamaño por defecto. Por defecto, una
esquina está situada a 1 unidad de cada uno de los ejes desde el srcen,
resultando un cubo que está centrado en el srcen y tiene 2 unidades de alto, de
ancho y de profundo.
ColorCube(double scale) Construye un cubo de color escalado por el valor
especificado. El tamaño por defecto es 2 unidades de lado. El ColorCube resultante
tiene esquinas en (scale, scale, scale) y (-scale, -scale, -scale).
.
Lección 44 Rotación de objetos

Una simple rotación del cubo puede hacer que se vea más de una de sus caras. El
primer paso es crear la transformación deseada usando un objeto Transform3D.
El fragmento de código de la Figura 82 incorpora un objeto TransformGroup en el
escenario gráfico para rotar el cubo sobre el eje x. Primero se crea la
transformación de rotación usando el objeto rotate de Transform3D, en la linea 24.
– UNAD
La rotación se especifica usando el

método rotX() de la línea 27.
Entonces se crea el objeto
TransformGroup en la línea 31
para contener la transformación de
rotación.
Dos parámetros especifican la

rotación: el eje de revolución, y el
ángulo de rotación.
Figura 82 Fragmento de código para rotar un objeto
El eje se elige seleccionando el método apropiado (rotX, rotY o rotZ). El ángulo de

rotación es el valor que se le pasa como argumento. Como el ángulo de rotación se
especifica en radianes, el valor PI/4 es 1/8 de una rotación completa, o 45 grados.
Solamente las líneas 24 y 27 ejecutan la rotación en un eje.
Después de crear el objeto Transform3D, rotate, se usa en la creacción del objeto
TransformGroup objRotate (línea 31). El objeto Transform3D se usa en el
escenario gráfico. Entonces el objeto objRotate hace que ColorCube sea su hijo
(línea 34). A su vez, el objeto objRoot hace a objRotate como su hijo (línea 33).
La rama de contenido gráfico ahora incluye un objeto TransformGroup en el camino
del escenario gráfico hacia el objeto ColorCube. Cada uno de los caminos del
escenario gráfico es necesario. El objeto BranchGroup es el único que puede ser
hijo de un Locale.
El objeto TransformGroup es el único que
puede cambiar la localización, la orientación,
o el tamaño de un objeto visual. En este caso
el objeto TransformGroup cambia la
orientación. Por supuesto, el objeto
ColorCube es necesario para suministrar el
objeto visual. A continuación se puede
observar el escenario gráfico producido por
el fragmento de la Figura 82. Figura 83 Escenario gráfico para la rotación
del cubo
El resultado de la ejecución de la rotación en un eje y al modificar el eje se se

puede observar en la siguiente secuencia gráfica.
– UNAD
Figura 84 Resultado de rotar el Figura 85 Resultado de rotar el Figura 86 Resultado de rotar el

cubo en X cubo en Y cubo en Z
44.1 Combinación de transformaciones

Frecuentemente un objeto visual se traslada y se rota, o se rota sobre dos ejes. En
cualquier caso, se especifican dos transformaciones diferentes para un sólo objeto
visual. Las dos transformaciones pueden combinarse en una matriz de
transformaciones y contenerse en un sólo objeto TransformGroup. Para el ejemplo
se pedirá revisar nuevamente el código de la Figura 82, correspondiente al
programa HelloJava3Db.java. Hasta el momento nos habíamos fijado solamente
en las líneas 24 y 27 para rotar el objeto visual en un solo eje, al incluir las demás
líneas se obtendrá una combinación de rotaciones.
Para crear estas dos rotaciones simultáneas se requiere combinar dos objetos
Transform3D de rotación. El ejemplo rota el cubo sobre los ejes x e y. Se crean dos
objetos Transform3D, uno por cada rotación (líneas 24 y 25). Las rotaciones
individuales se especifican para los dos objetos TransformGroup (líneas 27 y 28).
Luego las rotaciones se combinan mediante la multiplicación de los objetos
Transform3D (línea 29). La

el objeto TransformGroup combinación
(línea 31). de las dos transformaciones se carga en
El código completo del ejemplo HelloJava3Db.java es el siguiente:

/* @(#)HelloJava3Db.java 1.1 00/09/22 13:55
* Copyright (c) 1996-2000 Sun Microsystems, Inc. All Rights Reserved.
* HelloJava3Db dibuja un cubo simple rotado 45° en x y 36° en y
– UNAD
*/
import java.awt.BorderLayout;
import java.awt.Frame;
import java.awt.GraphicsConfiguration;
import com.sun.j3d.utils.applet.MainFrame;
import com.sun.j3d.utils.geometry.*;
import com.sun.j3d.utils.universe.*;
import javax.media.j3d.*;
import javax.vecmath.*;
public class HelloJava3Db extends Applet {
public BranchGroup createSceneGraph() {

// Crea la raíz del árbol
BranchGroup objRoot = new BranchGroup();
// El objeto rotate contiene la matriz de transformación

Transform3D rotate = new Transform3D();
Transform3D tempRotate = new Transform3D();
rotate.rotX(Math.PI/4.0d);
tempRotate.rotY(Math.PI/5.0d);
rotate.mul(tempRotate);
TransformGroup objRotate = new TransformGroup(rotate);
objRoot.addChild(objRotate);
objRotate.addChild(new ColorCube(0.4));
// Compila la escena gráfica

objRoot.compile();
return objRoot;
} // Fin del método CreateSceneGraph que crea la escena
– UNAD
// Crea una escena simple relacionada con el universo virtual

public HelloJava3Db() {
GraphicsConfiguration config = SimpleUniverse.getPreferredConfiguration();
Canvas3D canvas3D = new Canvas3D(config);
add("Center", canvas3D);
BranchGroup scene = createSceneGraph();
SimpleUniverse simpleU = new SimpleUniverse(canvas3D);
simpleU.getViewingPlatform().setNominalViewingTransform();
simpleU.addBranchGraph(scene);
} // Fin del constructor HelloJava3Db
public static void main(String[] args) {

Frame frame = new MainFrame(new HelloJava3Db(), 256, 256);
} // Fin del método main
} // Fin de la clase HelloJava3Db
En la Figura 87 se puede ver el escenario gráfico creado en HelloJava3Db.java. La

rama de vista gráfica es la misma producida en HelloJava3Da, que está construida
por un SimpleUniverse y representada por una gran estrella. La rama de contenido
gráfico ahora incluye un TransformGroup en el camino del escenario gráfico hacia
el objeto ColorCube. En la Figura 88 se puede observar el resultado de la
ejecución.
– UNAD
Figura 87 Escenario gráfico para varias

Figura 88 Ejecución de HelloJava3Db con
transformaciones
rotación en X e Y
44.2 Capacidades y Rendimiento
El escenario gráfico construido por un programa Java 3D podría usarse

directamente para renderizar. Sin embargo, la representación no es muy eficiente.
La flexibilidad construida dentro de cada objeto escenario gráfico (que no se van a
discutir en este tutorial) crean un representación sub-optima del universo virtual.
Para mejorar el rendimiento de la renderización se usa una representación más
eficiente del universo virtual.
Java 3D tiene una representación interna para una universo virtual y los métodos
para hacer la conversión. Hay dos formas para hacer que el sistema Java 3D haga
la conversión de la representación interna. Una forma es compilar todas las ramas
gráficas. La otra forma es insertar una rama gráfica en un universo virtual para
darle vida.
Compilar Contenidos
El objeto BranchGroup tiene un método compilador. Llamando a este método se
convierte la rama gráfica completa que hay debajo del BranchGroup a la
representación interna de Java 3D de la rama gráfica. Además de la conversión, la
representación interna podría optimizarse de una o varias maneras.
Las posibles optimizaciones no se especifican en el API Java 3D. Sin embargo, se
puede ganar en eficiencia de varias formas. Una de las posibles optimizaciones es
combinar TransformGroups con caminos de escenario gráfico. Por ejemplo, si un
– UNAD
escenario gráfico tiene dos objetos TransformGroup en una relacion padre-hijo

pueden ser representados por un objeto TransformGroup. Otra posibilidad es
combinar objetos Shape3D que tienen una relación estática física. Estos tipos de
optimizaciones se hacen posibles cuando las capacidades no se configuran.
La Figura 89 presenta una representación conceptual de la conversión a una
representación más eficiente. El escenario gráfico del lado izquierdo es compilado y
transformado en la representación interna mostrada en el lado derecho. La figura
sólo representa el concepto de representación interna, no como Java 3D realmente
lo hace.
Figura 89 Representación conceptual del proceso de compilar un escenario gráfico
Capacidades
Una vez que una rama gráfica empieza a vivir o es compilada el sistema de
renderizado Java 3D la convierte a una representación interna más eficiente. El
efecto más importante de esta conversión es la mejora del rendimiento de
renderizado.
Pero también tiene otros efectos, uno de ellos es fijar el valor de transformaciones y
otros objetos en el escenario gráfico. A menos que especificamente se le
proporcionen al programa, este no tendrá la capacidad de cambiar los valores de
los objetos del escenario gráfico una vez que estén vivos.
Hay casos en que un programa necesita la capacidad de cambiar estos valores
después de que estén vivos. Por ejemplo, cambiar el valor de un objeto
TransformGroup crea animaciones. Para que esto suceda, la transforamción debe
– UNAD
poder cambiar después de estar viva. La lista de parámetros a los que se puede
acceder, y de que forma, se llama capacidades del objeto.
Cada SceneGraphObject tiene un conjunto de bits de capacidad. Los valores de
estos bits determinan que capacidades existen para el objeto después de
compilarlo o de darle vida. El conjunto de capacidades varía con la clase.
SceneGraphObject es la superclase de casi cualquier clase usada para crear un
escenario gráfico, incluyendo Group, Leaf, y NodeComponent.
A continuación se presenta la lista parcial de métodos de SceneGraphObject.
void clearCapability(int bit) Borra el bit de capacidad especificado.
boolean getCapability(int bit) Recupera el bit de capcidad especificado.
void setCapability(int bit) Configura el bit de capacidad especificado.
Como ejemplo, para poder leer el valor de la transformación representada por un
objeto TransformGroup, esta capacidad debe activarse antes de compilarlo o darle
vida. De forma similar, para poder cambiar el valor de la transformación en un
objeto TransformGroup, su capacidad de escribir transformación debe configurarse
antes de compilarlo o darle vida. Intentar hacer un cambio en un objeto vivo o
compilado para el que la propiedad adecuada no se ha configurado resultará en
una excepción.
En la siguiente sección, las animaciones se crean usando una transformación de
rotación que varía con el tiempo. Para que esto sea posible, el objeto
TransformGroup debe tener su capacidad ALLOW_TRANSFORM_WRITE
activada antes de que sea compilado o se le de vida.
A continuación se presenta la lista parcial de capacidades de TransformGroup. Las
dos capacidades listadas aquí son las únicas definidas por TransformGroup. Éste
hereda varias capacidades de sus clases ancestros: Group y Node. La
configuración de capacidades se puede seleccionar, eliminar o recuperar usando
los métodos definidos en SceneGraphObject.
ALLOW_TRANSFORM_READ Especifica que el nodo TransformGroup permite
acceder a la información de transformación de su objeto.
ALLOW_TRANSFORM_WRITE Especifica que el nodo TransformGroup permite
escribir la información de transformación de su objeto.
Las capacidades también controlan el acceso a otros aspectos de un objeto
TransformGroup. Los objetos TransformGroup heredan configuración de
– UNAD
capacidades de sus clases ancestros: Group y Node. En el siguiente bloque de

referencia se pueden ver ver algunas de esas capacidades.
Lista Parcial de Capacidades de Group: TransformGroup hereda varios bits de
capacidades de sus clases ancestros.
ALLOW_CHILDREN_EXTEND Permite que se puedan añadir hijos al nodo Group
después de que esté compilado o vivo.

ALLOW_CHILDREN_READ Permite que se puedan leer las referencias a los
hijos del nodo Group después de que esté compilado o vivo.
ALLOW_CHILDREN_WRITE Permite que se puedan escribir las referencias a
los hijos del nodo Group después de que esté compilado o vivo.
Lección 45 Añadir Comportamiento de Animación

En Java 3D, Behavior es una clase para especificar animaciones o interacciones
con objetos visuales. El comportamiento puede cambiar virtualmente cualquier
atributo de uno objeto
predefinidos visual.
especificar unUn programador puede
comportamiento usar varios
personalizado. Unacomportamientos
vez que se ha
especificado un comportamiento para un objeto visual, el sistema Java 3D actualiza
automáticamente la posición, la orientación, el color, u otros atributos del objeto
visual.
La distinción entre animación e interacción es si el comportamiento es
activado en respuesta al paso del tiempo o en respuesta a actividades del
usuario, respectivamente.
Cada objeto visual del universo virtual puede tener su propio comportamiento
predefinido. De hecho, un objeto visual puede tener varios comportamientos. Para
especificar un comportamiento para un objeto visual, el programador crea objetos
que especifiquen el comportamiento, añade el objeto visual al escenario gráfico y
hace las referencias apropiadas entre los objetos del escenario gráfico y los objetos
Behavior.
En un universo virtual con muchos comportamientos, se necesita una significante
potencia de cálculo para calcular los comportamientos. Como tanto el renderizador
como el comportamiento usan el mismo procesador, es posible que la potencia de
cálculo que necesita el comportamiento degrade el rendimiento del renderizado.
– UNAD
Java 3D permite al programador manejar este problema especificando un límite

espacial para que el comportamiento tenga lugar. Este límite se llama región
programada. Un comportamiento no está activo a menos que el volumen de
activación de ViewPlatform interseccione con una región progamada del
Behavior. En otras palabras, si nadie en el bosque ve el árbol caer, éste no cae. La
característica de región programada hace más eficiente a Java 3D en el manejo de
universos virtuales con muchos comportamientos.
Un Interpolator es uno de las muchas clases de comportamientos predefinidos en
el paquete corazón de Java 3D. Basado en una función de tiempo, el objeto
Interpolator manipula los parámetros de un objeto del escenario gráfico. Por
ejemplo, para el RotationInterpolator, manipula la rotación especificada por un
TransformGroup para afectar la rotación de los objetos visuales que son
ancestros de TransformGroup.
La siguiente lista enumera los pasos que se requieren para especificar una
animación con un objeto Interpolator. Los cinco pasos forman una receta para
crear un comportamiento de animación con interpolación:
1. Crear un TransformGroup fuente. Selecciona la capacidad
ALLOW_TRANSFORM_WRITE.
2. Crear un objeto Alpha (función de tiempo en Java 3D). Especifica los
parámetros de tiempo para el alpha.
3. Crear el objeto Interpolator. Tiene referencias con los objetos Alpha y
TransformGroup. Personalizar los parámetros del comportamiento.
4. Especificar la región programada. Configurar la región programada para
el comportamiento.
5. Hacer el comportamiento como hijo del TransformGroup
45.1 Ejemplo de Comportamiento: HelloJava3Dc
El fragmento de código de la Figura 90 muestra un ejemplo completo del uso de

las clases interpoladoras para crear una animación. La animación creada con este
código es una rotación continúa con un tiempo de rotación total de 4 segundos.
– UNAD
Figura 90 Código para la creación de la escena con comportamiento RotationInterpolator
El paso 1 de la receta es crear el objeto TransformGroup para modificarlo durante

la ejecución. El objeto TransformGroup fuente de un interpolador debe tener
activada la capacidad de escritura. El objeto TransformGroup llamado objSpin se
crea en la línea 25. La capacidad de escritura de objSpin se selecciona en la línea
26.
El paso 2 es crear un objeto Alpha para dirigir la interpolación. Los dos parámetros
especificados en la línea 34 del fragmento de código son el número de
interacciones del bucle y el tiempo de un ciclo. El valor de "-1" especifica un bucle
contínuo. El tiempo se especifica en milisegundos por lo que el valor de 4000
significa 4 segundos. Por lo tanto, el comportamiento es rotar cada cuatro
segundos.
El paso 3 de la receta es crear el objeto Interpolator. El objeto
RotationInterpolator se crea en la línea 36. El interpolador debe tener referencias
a la transformación fuente y al objeto alpha. Esto se consigue en el constructor. En
este ejemplo se usa el comportamiento por defecto del RotationInterpolator para
hacer una rotación completa sobre el eje y.
El paso 4 es especificar una región programada. Se usa un objeto
BoundingSphere con sus valores por defecto. El objeto BoundingSphere se crea
en la línea 40. La esfera se configura como los límites del comportamiento en la
línea 41.
El paso final, el 5, hace del comportamiento un hijo del TransformGroup. Esto se
consigue en la línea 42.
Este fragmento de código se usa con otros fragmentos anteriores para crear el
programa de ejemplo HelloJava3Dc.java. Al ejecutar la aplicación veremos como
– UNAD
se renderiza el ColorCube con un comportamiento de rotación cada cuatro

segundos.
El programa HelloJava3Dc crea el

escenario gráfico de la Figura 91. El objeto
rotation es tanto hijo del TransformGroup
como una referencia a él. Aunque esta
relación parece violar las restricciones de
bucles dentro del escenaio gráfico, no lo
hace. Recuerda que los arcos de
referencia (flecha punteada) no son parte
del escenario gráfico. La línea punteada
Figura 91 Escenario gráfico incluyendo desde el Behavior hacia el
comportamiento TransformGroup es esta referencia.
La ejecución del ejemplo HelloJava3Dc proporciona la siguiente ventana gráfica:
Figura 92 Ejecución del ejemplo HelloJava3Dc.java
45.2 Clases que intervienen para programar el comportamiento de animación

Una acción de comportamiento puede ser cambiar la localización
(PositionInterpolator), la orientación (RotationInterpolator), el tamaño
(ScaleInterpolator), el color ( ColorInterpolator), o la transpariencia
(TransparencyInterpolator) de un objeto visual. Como se mencionó antes, los
Interpolators son clases de comportamiento predefinidas. Todos los
comportamientos mencionados son posibles sin usar un Interpolator; sin embargo,
– UNAD
los interpolators hacen mucho más sencilla la cracción de comportamientos. Las

clases Interpolators existen para proporcionar otras acciones, incluyendo
combinaciones de estas acciones.
Clase RotationInterpolator
Esta clase se usa para especificar un comportamiento de rotación de un objeto
visual
objeto oTransformGroup
de un grupo de objetos
a una visuales. Un objeto RotationIterpolator
rotación especififca cambia
en repuesta a un valor un
de un
objeto Alpha. Como el valor de este objeto cambia cada vez, la rotación también
cambia. Un objeto RotationInterpolator es flexible en la especificación del eje de
rotación, el ángulo de inicio y el ángulo final.
Para rotaciones constantes sencillas, el objeto RotationInterpolator tiene el
siguiente constructor que puede usarse para eso:
RotationInterpolator(Alpha alpha, TransformGroup target) Este constructor usa
valores por defecto de algunos parámetros del interpolador para construir una
rotación completa sobre el eje y, usando el TransformGroup especificado. Los
parámetros son:
alpha: la función de variación de tiempo para referencia.
target: el objeto TransformGroup a modificar.
El objeto TransformGroup de un interpolador debe tener la capacidad de escritura
activada.
Mapear una acción en el tiempo se hace usando un objeto Alpha. La especificación
de este objeto puede ser compleja.
Clase Alpha
Los objetos de la clase Alpha se usan para crear una función que varía en el
tiempo. La clase Alpha produce un valor entre cero y uno, inclusives. El valor que
produce depende de la hora y de los parámetros del objeto Alpha. Los objetos
Alpha se usan comunmente con un comportamiento Interpolator para proporcionar
animaciones de objetos visuales.
Alpha tiene diez parámetos, haciendo la programación tremendamente flexible. Sin
entrar en detalles de cada parámetro, saber que un ejemplar de Alpha puede
combinarse fácilmente con un comportamiento para proporcionar rotaciones
– UNAD
sencillas, movimientos de péndulo, y eventos de una vez, como la apertura de

puertas o el lanzamiento de cohetes.
La clase Alpha proporciona objetos para convertir la hora en un valor alpha (un
valor entre 0 y 1). El objeto Alpha es efectivamente una función de tiempo que
genera valores alpha entre cero y uno. La función "f(t)" y las características del
objeto Alpha están determinadas por parámetros definidos por el usuario:
Algunos constructores para el objeto Alpha son:
Alpha()
Bucle continuo con un periodo de un segundo.
Alpha(int loopCount, long increasingAlphaDuration)
Este constructor toma sólo loopCount e increasingAlphaDuration como parámetros
y asigna los valores por defecto a todos los demás parámetros, resultando un
objeto Alpha que produce valores desde cero a uno crecientes. Esto se repite el
número de veces especificado por loopCount. Si loopCount es -1, el objeto alpha
se repite indefinidamente. El tiempo que tarde en ir desde cero hasta uno está
especificando en el segundo parámetro usando una escala de milisegundos.
Los parámetros:
loopCount: número de veces que se ejecuta este objeto alpha; un valor de -1
especifica un bucle indefinido.
increasingAlphaDuration: tiempo en milisegundos que tarda el objeto alpha en ir de
cero a uno.
Región Progamada
Como se mencionó anteriormente, cada comportamiento tiene unos límites

programados. Estos límites se configuran usando el método
setSchedulingBounds de la clase Behavior.
Hay varias formas de especificar una región programada, la más sencilla es crear
un objeto BoundingSphere. Otras opciones incluyen BoundingBox y
BoundingPolytope.
La sintaxis del método setShedulingBounds se presenta a continuación:
void setSchedulingBounds(Bounds region)
– UNAD
Selecciona la región programada del Behavior a unos límites especificados por el

parámetro region.
Clase BoundingSphere
Especificar un límite esférico se consigue especificando un punto central y un rádio
para la esfera. El uso normal de este tipo de límites es usar el centro a (0, 0, 0).
Entonces el radio se selecciona lo suficientemente grande como para contener el
objeto visual, incluyendo todas las posibles localizaciones del objeto.
Algunos de los constructores de BoundingSphere son:
BoundingSphere() Este constructor crea una límite esférico centrado en el srcen
(0, 0, 0) con un radio de 1.
BoundingSphere(Point3d center, double radius) Construye e inicializa un
BoundingSphere usando el punto central y el rádio especificados.
45.3 Ejemplo de combinación de Transformación y Comportamiento:

HelloJava3Dd
Como se puede suponer, es posible combinar comportamientos con las
transformaciones de rotación de los ejemplos anteriores. HelloJava3Dd.java hace
esto. En la rama de contenido gráfico, hay objetos llamados objRotate y objSpin,
que distinguen entre la rotación estática y el comportamiento de rotación (bucle
continuo) del objeto Cube respectivamente. El código completo de la aplicación
que permite dibujar la escena se presenta a continuación.
/* @(#)HelloJava3Dd.java 1.1 00/09/22 13:55
* Copyright (c) 1996-2000 Sun Microsystems, Inc. All Rights Reserved.
* Este ejemplo presenta la animación continua de un cubo rotado

*/
import java.awt.BorderLayout;
import java.awt.Frame;
import java.awt.GraphicsConfiguration;
import com.sun.j3d.utils.applet.MainFrame;
– UNAD
import com.sun.j3d.utils.geometry.ColorCube;
import com.sun.j3d.utils.universe.*;
import javax.media.j3d.*;
import javax.vecmath.*;
public class HelloJava3Dd extends Applet {
public BranchGroup createSceneGraph() {

// Crea la raiz de la escena
BranchGroup objRoot = new BranchGroup();
// Estas son las líneas que permiten la rotación

// combinada en los ejes X e Z.
Transform3D rotate = new Transform3D();
Transform3D tempRotate = new Transform3D();
rotate.rotX(Math.PI/4.0d);
tempRotate.rotZ(Math.PI/5.0d);
rotate.mul(tempRotate);
TransformGroup objRotate = new TransformGroup(rotate);
// Estas son las líneas que permiten el Behavior o

// animación de rotación continua, observada en HelloJava3Dc
TransformGroup objSpin = new TransformGroup();
objSpin.setCapability(TransformGroup.ALLOW_TRANSFORM_WRITE);
objRoot.addChild(objRotate);
objRotate.addChild(objSpin);
// Crea el ColorCube y lo agrega a la escena

objSpin.addChild(new ColorCube(0.4));
// Crea el objeto Behavior para desarrollar la animación deseada

// que consiste en un rotación continua sobre el eje Y cada 4 sg
Transform3D yAxis = new Transform3D();
Alpha rotationAlpha = new Alpha(-1, 4000);
– UNAD
RotationInterpolator rotator =
new RotationInterpolator(rotationAlpha,
objSpin, yAxis,
0.0f, (float)
Math.PI*2.0f);
// Se especifica el área activa de la escena como una Esfera

BoundingSphere bounds = new BoundingSphere();
rotator.setSchedulingBounds(bounds);
objSpin.addChild(rotator);
return objRoot;
} // Fin del método CreateSceneGraph
public HelloJava3Dd() {
GraphicsConfiguration config = SimpleUniverse.getPreferredConfiguration();
Canvas3D canvas3D = new Canvas3D(config);

add("Center", canvas3D);
BranchGroup scene = createSceneGraph();

scene.compile();
SimpleUniverse simpleU = new SimpleUniverse(canvas3D);
simpleU.getViewingPlatform().setNominalViewingTransform();
simpleU.addBranchGraph(scene);
} // Fin del constructor de HelloJava3Dd
public static void main(String[] args) {

Frame frame = new MainFrame(new HelloJava3Dd(), 256, 256);
} // Fin del método main
} // Fin de la clase HelloJava3Dd
– UNAD
La representación gráfica de la escena y la ventana generada se muestran en las

siguientes figuras:
Figura 93 Escena gráfica que combina Figura 94 Ejecución del ejemplo

transformación y comportamiento HelloJava3Dd.java
– UNAD

ALLIMANT, Frank. Archivo de ayuda construido a partir de la documentación del
J2SE. [En línea] http://www.confluent.fr/javadoc/indexe.html. Fecha de consulta:
Enero de 2006.
CREATIVE COMMONS. Definición de Alpha Blending. [En línea]
http://grafics.pina.be/definicio.php?id=21 Fecha de consulta: Enero de 2006.

FOLEY, James D.; VAN DAM, Andries; FEINER, Steven K. y HUGHES, John F.
Computer graphics: principles and practice, Addison Wesley, 1996.
FROUFE, Agustín. Tutorial de Java. [En línea]
http://www.itapizaco.edu.mx/paginas/JavaTut/froufe/introduccion/indice2.html#quinc
e. Fecha de consulta: Noviembre de 2005.
JAVA EN CASTELLANO. Gráficos con Java 2D. Traducción del Tutorial de Sun
Microsystems realizada por Juan Antonio Palos (ozito) [En línea]
http://www.programacion.com/java/tutorial/2d/1/. Fecha de consulta: Noviembre de
2005.
MANZANEDO, Miguel Angel et al. Guía rápida de aprendizaje del lenguaje Java.
[En línea] http://pisuerga.inf.ubu.es/lsi/Invest/Java/Tuto.Oct98/index.htm. Fecha de
consulta: Noviembre de 2005.
OVERCLOCKERS. CL. Definición del término Alpha Blending. [En línea]
http://www.overclockers.cl/modules.php?name=enciclopedia&ver=4 Fecha de
consulta: Enero de 2006.
PLANETALIA.COM. Curso para la programacion de un juego de marcianitos en
Java. [En línea] http://www.planetalia.com/cursos/Java-Invaders/JAVA-INVADERS-
00.clase. Fecha de consulta: Diciembre de 2005.
PLANETALIA.COM. Videojuegos programados en Java. [En línea]
http://www.planetalia-exitos.com/videojuegos.jsp. Fecha de consulta: Diciembre de
2005.
PROGRAMACIÓN EN CASTELLANO. Curso de programacion Java en 3D.
Traducción del curso de Sun Microsystems realizada por Juan Antonio Palos (ozito)
[En línea] http://www.programacion.com/tutorial/3d/1/. Fecha de consulta:
Noviembre de 2005.
– UNAD
SUN MICROSYSTEMS: Sitio oficial para descargas y documentación de Java. [En

línea] http://java.sun.com/products/java-media/3D/downloads/index.html y
http://java.sun.com/products/java-media/3d Fecha de consulta: Diciembre de 2005.
WIKIPEDIA. Definición de API. [En línea] http://es.wikipedia.org/wiki/API. Fecha de
consulta: Enero de 2006.

Módulo Computación Gráfica PDF

Hochgeladen von

Dokumentinformationen

Originaltitel

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

Módulo Computación Gráfica PDF

Hochgeladen von

Copyright:

Verfügbare Formate

– UNAD

UNIVERSIDAD NACIONAL ABIERTA Y A DISTANCIA

UNIVERSIDAD NACIONAL ABIERTA Y A DISTANCIA

ESCUELA DE CIENCIAS BÁSICAS, TECNOLOGÍA E INGENIERÍA

MODULO DEL CURSO ACADÉMICO

OSCAR JAVIER ABAUNZA GARCÍA

Bucaramanga, Julio de 2012

UNIDAD 1 FUNDAMENTOS DE COMPUTACIÓN GRÁFICA.............................................. 9

Lección 3 Teorías y planteamientos............................................................................ 15

CAPÍTULO 6 Transformaciones ..................................................................................... 84

Lección 37 Áreas ...................................................................................................... 129

ASPECTOS DE PROPIEDAD INTELECTUAL Y VERSIONAMIENTO

El contenido didáctico del curso académico Computación Gráfica fue diseñado

 Adecuación del diseño según plantilla material didáctico UNAD.

 Distribución de unidades, capítulos y lecciones según el estándar CORE.

 Adición del capítulo 4 Requerimientos de software.

 Actualización de herramientas para el desarrollo, codificación y librerías.

Gracias a la paranoia de la Guerra Fría, el Departamento de Defensa de Estados

se desarrollaron una serie de técnicas encaminadas a permitir la transmisión de

el aprendizaje de otras herramientas de graficación, lo mismo que el desarrollo de

mapa conceptual y productos de aprendizaje, con el fin de recordar y orientar el

Como es de esperarse, este módulo es una primera aproximación que se espera

UNIDAD 1 FUNDAMENTOS DE COMPUTACIÓN GRÁFICA

Al finalizar esta unidad didáctica el estudiante estará en capacidad de:

Mapa Conceptual de la Unidad

Pequeño Grupo Colaborativo

CAPÍTULO 1 Evolución de la computación gráfica

La sabiduría popular dice que la historia no se repite y que el pasado no aplica

Lección 1 Anticipando la tecnología

acelerar los cálculos requeridos para los cómputos de la energía balística y

 Las aplicaciones de tiempo compartido entre varios usuarios.

 La lectura óptica de caracteres.

Lección 2 Los primeros aportes

Algunas de las nuevas y poderosas ideas y conceptos fueron:

 Estructura jerárquica interna de los gráficos.

Sketchpad propició el nacimiento de la ciencia de gráficas controladas por

Un estudiante de la clase de Sutherland en la universidad de Utah, EDWIN

Lección 3 Teorías y planteamientos

Ed Catmull realizó su tesis de doctorado

El matemático francés Dr. BENOIT MANDELBROT publicó un ensayo que permitió

Algunos de los trabajadores de la Universidad de Utah también fueron invitados y

Dotando de texturas y relieves se pueden crear modelos bastante realistas. El

En animación y videojuegos se dio un desarrollo espectacular en la calidad e

Figura 6 Largometrajes completamente desarrollados por computador

Durante los 90’s, Hollywood proporciona una gran publicidad gracias a la

Lección 5 Cronología en el desarrollo de la computación gráfica

de la computación gráfica tomada y traducida libremente de www.comphist.org.

CAPÍTULO 2 Fundamentos de computación gráfica

Lección 6 Tipos de graficación computacional

Figura 7 Mapa de bits

Un píxel es pues una unidad de información, pero no una unidad de medida, ya

Figura 8 Dos rejillas de 3*3 píxeles

La resolución de una imagen es un concepto que suele confundir bastante,

Figura 9 Modificación en la resolución

Figura 10 Efecto de pixelado en mapas de bits

El principal inconveniente con los gráficos de mapas de pixeles durante el

6.2 Gráfico vectorial

describe el camino entre ellos. Análogamente, un círculo se define vectorialmente

Figura 11 Transformaciones en gráficos vectoriales

Lección 7 Sistema de coordenadas

En el soporte aritmético de la computadora, dicha representación se efectúa con

Figura 12 Sistema de coordenadas en el espacio de la escena

la escena (euclidiano) (x; y)  R2 . La conversión de los valores reales del espacio