Está en la página 1de 67
¿Qué temas estudiamos en la clase anterior?
¿Qué temas
estudiamos en la
clase anterior?

¿Qué han investigado acerca del tema a estudiar el día de hoy?

Tópico II

Unidad I

Primitivas gráficas y algoritmos

Semana 2

Algoritmos para dibujar primitivas gráficas

Objetivo General

Analizar, comprender y emplear las técnicas de representación gráfica mediante en un entorno de programación

de uso general.

Objetivo Específico

Aplicar los conceptos relacionados

a

las

representaciones

gráficas,

describiendo y deduciendo

algoritmos.

Objetivo Instruccional

Comprender los conceptos relacionados

a la Computación Grafica y su entorno

de desarrollo y aplicación.

Pantalla gráfica Líneas Rectas Circunferencias Otras primitivas Atributos de primitivas
Pantalla gráfica
Líneas Rectas
Circunferencias
Otras primitivas
Atributos de primitivas

Pantalla gráfica

Sistema de coordenadas físico

(Espacio de la escena)

0

Máxima x 1

Pantalla gráfica Sistema de coordenadas físico (Espacio de la escena) Máxima x – 1 x =

x = 0, y = 0

Pantalla gráfica Sistema de coordenadas físico (Espacio de la escena) Máxima x – 1 x =

0

Pantalla gráfica Sistema de coordenadas físico (Espacio de la escena) Máxima x – 1 x =

Pixel

Pantalla gráfica Sistema de coordenadas físico (Espacio de la escena) Máxima x – 1 x =

(x,y)

Pantalla gráfica Sistema de coordenadas físico (Espacio de la escena) Máxima x – 1 x =

x = Máxima x 1

y = Máxima y 1

Máxima y 1

Pantalla gráfica Sistema de coordenadas físico (Espacio de la escena) Máxima x – 1 x =

El espacio de pantalla, es un espacio discretizado y acotado [0

maxX]x[0

maxY]

el cual esta en

.. correspondencia con el espacio de la escena (x,y) ϵ R 2 / X = round(x) y Y = round(y).

..

La operación de llevar una primitiva del espacio de la escena al espacio de pantalla se denomina

DISCRETIZACION

Pantalla gráfica

Primitivas gráficas

PUNTOS • Se especifican a partir de su localización y color
PUNTOS
• Se especifican a partir de su localización y color
SEGMENTO DE RECTA • Se especifican a partir de un par de puntos que representan sus
SEGMENTO DE RECTA
• Se especifican a partir de un par de puntos que
representan sus extremos
CIRCUNFERENCIAS • Se especifican con la posición de su centro y su radio
CIRCUNFERENCIAS
• Se especifican con la posición de su centro y su radio
POLIGONOS • Se representan a partir de una secuencia de puntos que determina la poligonal de
POLIGONOS
• Se representan a partir de una secuencia de puntos que
determina la poligonal de su perímetro

Pantalla gráfica

Especificaciones de una

discretización

Apariencia

Se espera que un segmento de

recta tenga una «apariencia

recta»

Simetría /

invariancia

geométrica

El método de discretización debe

producir resultados

equivalentes si se modifican algunas de sus propiedades

Simplicidad y

velocidad de computo

Los métodos tienden a no

depender de estructuras complejas

Pantalla gráfica

Métodos de discretización

Dada una primitiva grafica a discretizar, se debe encontrar los pixeles que la representan de la forma mas correcta posible.

Evaluar su ecuación diferencial a diferencias finitas:

Denominado DDA (discrete diference analyzer) consiste en plantear la ecuación diferencial de la primitiva a discretizar, y luego evaluar dicha expresión a intervalos adecuados.

Análisis del error:

Desarrollados por Bressenham, y se basan en analizar, dado un pixel que pertenece a la discretización de la primitiva cual es el próximo pixel que minimiza una determinada expresión que evalúa el error que comete la discretización.

Líneas rectas

Trazo de líneas rectas paralelas a

los ejes

La línea recta es la más fácil de dibujar

Las líneas rectas paralelas a los ejes se pueden

trazar en un simple lazo for.

El siguiente código traza un línea horizontal desde x a x+ancho.

for(i = x; i < x+ancho; i++)

putpixel(i,y,color);

De forma similar se traza un línea vertical

Líneas rectas

#include <iostream>

#include <graphics.h>

using namespace std;

Ejemplo

void lineaH(int x1, int x2,int y, int color){

int dx;

dx = x2>x1?x2-x1:x1-x2; for(int i=0;i<dx;i++)

putpixel(x1+i,y,color);

}

int main(int argc, char *argv[]) { int i; initwindow(400, 300);

for(i = 0; i< 1000; i++){

lineaH(rand()%100,rand()%300,rand()%300,rand()%15+1);

}

getch();

closegraph();

return EXIT_SUCCESS;

}

Líneas rectas

Dibujo de Líneas Rectas

Una línea recta debe dibujarse como una sucesión de píxeles.

Efecto de escalera que se produce cuando se genera una línea como una serie de píxeles.

Líneas rectas Dibujo de Líneas Rectas Una línea recta debe dibujarse como una sucesión de píxeles.

Líneas rectas

Ecuación básica de la recta:

y m x b

b
b

Dados (x 1 ,y 1 ) y (x 2 ,y 2 ), los dos extremos de un segmento se puede determinar:

m,

que es la pendiente

b, que es el coeficiente de posición, que indica la intersección con el eje y

m

y

2

y

1

x

2

x

1

 

y

 

x

b y

1

m x

1

Líneas rectas

Para

cualquier intervalo Δx de

x

a

lo

largo de

la

recta,

se

puede

calcular

el Δy correspondiente

como:

y m  x

Si |m| < 1 la línea es mas horizontal que vertical.

Según tiende a cero m, la línea tiende a ser horizontal

Si |m| > 1 la línea es mas vertical que horizontal.

Según tiende a infinito m, la línea tiende a ser vertical

Líneas rectas

El siguiente paso es efectuar un muestreo de la línea a puntos discretos correspondientes a los pixeles mas cercanos.

Algoritmo básico:

El algoritmo básico será utilizar la ecuación anterior para calcular y en termino de x (o viceversa).

Esto seria lento

(en

el

contexto

computaciona)

ya

que

requeriría siempre una multiplicación más una suma.

y m x b

Líneas rectas

Algoritmos para trazo de líneas

rectas

Algoritmo DDA (analizador diferenciador discreto), algoritmo incremental básico con aritmética de punto flotante.

Algoritmo de Bressenham, algoritmo incremental complejo con sólo aritmética entera.

Líneas rectas

Algoritmos para trazo de líneas

rectas

Algoritmo DDA

(Se basa en aritmética de punto flotante)

Algoritmo DDA

Líneas rectas

Algoritmo de conversión de rastreo que se basa en el calculo de ∆y o ∆x.

Para cualquier intervalo Δx de x a lo largo de la recta, se puede calcular el Δy correspondiente como:

y m  x

Algoritmo DDA

Líneas rectas

CASO I: Si la pendiente es positiva y menor que 1 (|m|≤ 1), se toman variaciones de x iguales a 1 y se calcula y.

Es decir: El muestreo se realiza en x, en intervalos unitarios (∆x=1 y ∆y=m dado que m = ∆y /∆x) y se calcula cada valor sucesivo de y como:

y

i

1

y

i

m

El subíndice toma valores enteros a partir de 1 y aumenta a razón de 1 hasta alcanzar el valor final.

Ya que m puede ser cualquier número real entre 0 y 1, los valores calculados de y deben redondearse al entero mas cercano.

Algoritmo DDA

Líneas rectas

CASO II: En las rectas con pendiente mayor que 1 (|m|> 1), se invierten los papeles de x, y de y.

Es decir: El muestreo se realiza en x, en intervalos unitarios (∆y=1 y ∆x=1/m dado que m = ∆y /∆x) y se calcula cada valor sucesivo de x como:

x

i

1

x

i

1 /

m

¿A que caso de discretización representa la gráfica? Líneas rectas Algoritmo DDA
¿A que caso de discretización
representa la gráfica?
Líneas rectas
Algoritmo DDA

Algoritmo DDA

Líneas rectas

Las ecuaciones del caso (i) y (ii) se basan en la suposición de que las líneas deben

procesarse del derecho.

extremo

izquierdo

al

Si este procesamiento se revierte, entonces ∆x y ∆y serian -1, y:

y

i

1

x

i

1

y

1 /

i

x

i

m

m

Algoritmo DDA

Líneas rectas

void Line(Display* display, Window win, GC gc, int x0, int y0, int x1, int y1){ float x, y, xs, ys; int dx, dy, steps;

dx = x1 x0; dy = y1 y0;

/* se asigna el punto de donde se comenzara a dibujar la línea */

x = x0; y = y0;

/* verificar si la pendiente es mayor que x o y, para luego asignarle steps */

if

(abs(dx) > abs(dy))

steps = abs(dx); else steps = abs(dy);

/* se divide por la pendiente mayor, para dar xs o ys igual a 1 ( o -1) */

if (steps == 0){ XDrawPoint(Display,win,gc,round(x),round(y));

fprintf(sterr,”La línea es un punto);

return;

}

xs = dx / steps;

ys = dy / steps;

/* se cicla uno a la vez hasta llegar al numero de steps máximo */

for (i = 0; i <= steps; i++) { XDrawPoint(display, win,gc,round(x),round(y)); /* round(x) -> x + 0.5 */ x = x + xs; y = y + ys;

}

}

Líneas rectas

Algoritmos para trazo de líneas

rectas

Algoritmo de Bressenham

(Se basa en aritmética entera)

Algoritmo de Bressenham

Líneas rectas

El algoritmo busca cual de dos pixeles es el que está mas cerca según la trayectoria de la línea.

Consideremos el proceso de conversión para líneas con

pendiente positiva:

0 < m < 1.

Las posiciones de pixel a lo largo de la trayectoria de una línea se determinan al efectuar muestreo de x en intervalos unitarios.

Si suponemos que se debe desplegar el pixel en (x k ,y k ), a continuación se necesita decidir que pixel se debe desplegar en la columna x k +1. Las alternativas son los pixeles: (x k +1,y k ) y (x k +1,y k +1)

Algoritmo de Bressenham

Líneas rectas

Al realizar el muestreo en la posición x k +1 designamos la separación de pixeles verticales de la trayectoria de la línea matemática como d 1 y d 2 .

Algoritmo de Bressenham Líneas rectas Al realizar el muestreo en la posición x +1 designamos la

La coordenada de y en la línea matemática en la posición de la columna de pixel x k +1 se calcula como:

Entonces:

y

mx

k

1 b

RECORDANDO:

b y

1

m x

1

d

1

y

 

y

k

m x    1  b k
m x
 
1
b
k

y

k

d

2

y

k

y

k

1

 

y

mx  1  b  k
mx
 1  b
k

1

Algoritmo de Bressenham

Líneas rectas

La diferencia es:

d

1

1

d m x   y b

2

2

k

2

k

2

1

definimos p k como:

donde c es:

p

k

 

x d

(

1

d

2

)

2

 

y

x

k

2

 

x

y

k

c

c 2y  x2b 1

Obtenemos p k+1 de p k como:

p

k

1

2

 

y

x

k

1

2

 

x

y

k

1

c

Algoritmo de Bressenham

Líneas rectas

Restando p k+1 y p k :

p

k

1

p

k

2

y x

k

1

x

k

 x y

2

k

1

y

k

Simplificando:

p

k

1

p  y  x y

k

2

2

k

1

y

k

Donde

el

termino

(y k+1

-

y k )

es

0

o

1,

dependiendo del signo del parámetro p.

Este cálculo de los parámetros de decisión se

realiza en cada posición entera de x, empezando

en el extremo izquierdo de las coordenadas de la

línea.

Algoritmo de Bressenham

Líneas rectas

El primer parámetro (inicial) p 0 , se evalúa a partir

de:

p

k

 

x

(

d

1

d

2

)

2

 

y

x

k

2

 

x

y

k

c

con:

b = y 0 m x 0

Entonces:

y

m = ∆y/ ∆x

Algoritmo de Bressenham Líneas rectas El primer parámetro (inicial) p , se evalúa a partir de:

De donde se obtiene:

p 2y  x

0

Algoritmo de Bressenham

Líneas rectas

En resumen, los pasos son:

1. Se capturan los dos extremos de la línea y se almacena el extremo izquierdo en (x 0 , y 0 ).

  • 2. Se carga (x 0 , y 0 ) en el buffer de la estructura, o sea, se traza el primer punto.

  • 3. Calcule ∆x = x 1 x 0 ,

y = y 1 y 0

y

p 0 = 2 ∆y - x.

  • 4. En cada x k a lo largo de la línea, que inicia en k=0, se efectúa la prueba siguiente:

Si p k 0 , el siguiente punto que debe trazarse es (x k +1,y k ), y

p

k

1

p

k

 

2

y

de otro modo, el siguiente punto a trazarse es (x k +1,y k +1), y

p

k

1

p

k

x

   

2

y

5. Repita el paso 4 hasta que x llegue al otro extremo.

Algoritmo de Bressenham

Líneas rectas

Ejemplo

Para ilustrar el algoritmo, utilicemos la línea con extremos (20,10) y

(30,18).

Esta línea tiene una pendiente de 0.8, con: ∆x = 10 , ∆y = 8 El parámetro de decisión inicial tiene el valor: p 0 = 2∆y - ∆x = 6 Y los incrementos para calcular parámetros de decisión sucesivos

son:

2∆y = 16

,

2∆Y - 2 ∆X = 2(∆Y - ∆X)

= -4

Trazamos el punto inicial (x0,y0) = (20,10) y determinamos las posiciones pixel sucesivos a lo largo de la trayectoria de la línea a partir del parámetro de decisión como:

k

P k

(x k +1,y k +1)

0

 
  • 6 (21,11)

1

 
  • 2 (22,12)

2

-2

(23,12)

3

14

(24,13)

4

10

(25,14)

5

6

(26,15)

6

2

(27,16)

7

-2

(28,16)

8

14

(29,17)

9

10

(30,18)

Algoritmo de Bressenham Líneas rectas Ejemplo Para ilustrar el algoritmo, utilicemos la línea con extremos (20,10)

Un trazo de pixeles se genera a lo

largo

de

la

trayectoria

de

esta

línea.

Algoritmo de Bressenham

Líneas rectas

void LineBres(Display display, Window win, GC gc, int x0, int y0, int x1, int y1) { int x, y , dx, dy, xend, p, incE, inc NE; dx = abs(x1 x0); dy = abs(y1 y0); p = 2 * dy dx; incE = 2 * dy; inc NE = 2 * (dy dx); /* determinar que punto usar para empezar, cual para terminar */ if ( x0 > x1 ) { x = x1; y = y1;

xend = x0;

}

else

{

x = x0; y = y0; xend = x1;

}

/* se cicla hasta llegar el extremo de la línea */

while ( x <= xend) { XDrawPoint(display, win,gc,x,y); x = x+1; if (p < 0)

 

p = p + incE

else {

 

y = y +1; p = p + incNE;

}

}

}

Líneas rectas

Proyecto

Hacer las siguientes primitivas con funciones en C.

Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.
Líneas rectas Proyecto Hacer las siguientes primitivas con funciones en C.

Líneas rectas

Algoritmos para trazo de líneas

rectas

Investigar

Algoritmo de Punto Medio para la Línea

Circunferencias

Algoritmos de generación de circunferencias

La ecuación de la

circunferencia en

coordenadas rectangulares

es:

x xc

2

y yc

2

2

r

De ésta se puede

despejar como sigue:

y yc

Circunferencias Algoritmos de generación de circunferencias La ecuación de la circunferencia en coordenadas rectangulares es: 

r

  • 2 x xc

2

 
r
r
 

xc

yc

Circunferencias

Algoritmos para trazo de

circunferencias

Algoritmo de Bressenham

Algoritmo de punto medio

Circunferencias

Algoritmos para trazo de

circunferencias

Algoritmo de Bressenham

Algoritmo de Bressenham

Circunferencias

Se supone (x i , y i ) la posición más próxima a la

trayectoria, la siguiente posición es por tanto

(x i +1, y i ) o bien (x i +1, y i -1).

y i 2 + x + i 1 x x i i i y - 1
y i 2 + x + i 1 x x i i i y - 1
y i 2 + x + i 1 x x i i i y - 1
y i 2 + x + i 1 x x i i i y - 1
y i 2 + x + i 1 x x i i i y - 1
y i 2 + x + i 1 x x i i i y - 1

y i

y i
2 + x + i 1 x x i
2
+
x
+
i
1
x
x i
y i 2 + x + i 1 x x i i i y - 1
i
i
i y - 1 i
i
y
- 1
i
- 2 y
- 2
y

2

2

2

x

+

y

=

r

Algoritmo de Bressenham

Circunferencias

Una medida de la diferencia de coordenadas

puede definirse como:

d

 

2

2

  • 1 y

y

i

 

2

2

y

i

r

y

2

y

i

r

2

x

i

y i y d 1 d 2 y - 1 i 2 1  x +
y i
y
d 1
d 2
y
-
1
i
2
1
x
+
1
i

x

i

1

2

 

2

1

2

y

d

1

d

2

2

x

1

i

i

d

  • 2 1

Definiendo p i como la diferencia de d 1 y d 2

tenemos

p

i

2

y

2

i

y

i

1

2

2

r

2

Algoritmo de Bressenham

Circunferencias

El valor de p i+1 es:

p

i

1

2

x

i

1

1

2

y

2

i

1

y

i1

1

2

2 r

2

Simplificando

p

i1

p

i

4

x

i

6

 

2

y

2

i

1

y

2

i

2

y

i

1

y

i

p 1 se obtiene de (x 1 , y 1 ) = (0, r)

p

  • 1 3 2

r

Algoritmo de Bressenham

Circunferencias

1. Seleccione la primera posición como

x

1

,

y

1

r

0,

  • 2. Calcule el primer parámetro como

1

3 2

p

i

4

x

i

p

r

si p i <0, la siguiente posición es (x i +1, y i ), si no es (x i +1, y i -1)

  • 3. Incremente x en 1. Seleccione p i+1 si p i <0 como

p

i

1

6

y en caso contrario

p

i

1

p

i

4

x

i

y

i

10

Si p i+1 <0 el siguiente punto será(x i +2, y i+1 ), de lo contrario

es (x i +2, y i+1 1).

La coordenada y es y i+1 =y i , si p i <0 o bien y i+1 = y i 1 si p i 0.

  • 4. Repita el paso 3 hasta que x y y sean iguales.

Circunferencias

Algoritmos para trazo de

circunferencias

Algoritmo de Punto medio

Algoritmo de Punto medio

Circunferencias

El método de trazo del punto medio de la circunferencia se basa en la definición de la función circunferencia :

f

circunferencia

x, y

2

x

y

2

r

2

Un punto (x,y) arbitrario cumple con lo siguiente

f

circunferencia

x

,

y

0 ,

  

0 ,

0 ,

si

x

,

y

está dentro de la circunferencia

si

x

,

y

está en la frontera de la circunferencia

si

x

,

y

está fuera de la circunferencia

Algoritmo de Punto medio

Circunferencias

Para decidir entre el punto (x k +1, y k ) y (x k +1, y k -1) se utiliza la fórmula anterior evaluada en el punto medio entre los

dos pixeles

p  f  x  1 , y  k circunferencia k k 2 2
p
f
x
1
,
y
k
circunferencia
k
k
2
2
x
1
y
1 2
k
k
1 2

1 2

2

r

Si p k <0 el punto está dentro de la circunferencia y el pixel (x k +1, y k ) es el más próximo a la frontera. Sino, el punto está fuera y el más cercano es (x k +1, y k -1).

Obtendremos una expresión recursiva para el siguiente parámetro de decisión cuando evaluamos la función de circunferencia en la posición x k +1 = x k +2.

Algoritmo de Punto medio

Circunferencias

o

p

k

f  x  1 , y  1 2  circunferencia k  1 k
f
x
1
,
y
1 2
circunferencia
k
1
k
1
2
2

x
1
1
y
1 2
k
k  1

r

2

p

k

1

p

k

2

x

k

1

 y

k 2

1

y

2

k

 y

k

  • 1 y

k

1

Si p k <0, el incremento es 2x k +1 + 1. Sino el incremento es

2x k 2y k +1 +1. Los valores x k +1 y y k +1 se pueden calcular

con:

2 2

x y

k

k

1

1

 

2 2

y x

k

k

 

2 2

El valor inicial es:

p

0

5

4

r

x – 2*tamanio y – 2*tamanio x – 4*tamanio y – tamanio x – 2*tamanio y
x – 2*tamanio
y – 2*tamanio
x
– 4*tamanio
y – tamanio
x
– 2*tamanio
y – tamanio
x + 4*tamanio
y + tamanio
x
+ 2*tamanio
y + tamanio
Circunferencias

Dibujo de una compuerta and

Centro de la compuerta: x, y

x – 2*tamanio y – 2*tamanio x – 4*tamanio y – tamanio x – 2*tamanio y

x + 2*tamanio y 2*tamanio

x – 2*tamanio y – 2*tamanio x – 4*tamanio y – tamanio x – 2*tamanio y

Arco con centro en: x + 2*tamanio, y

Radio de:2*tamanio de 0 a 90 grados.

x – 2*tamanio y – 2*tamanio x – 4*tamanio y – tamanio x – 2*tamanio y

Arco con centro en: x + 2*tamanio, y+1

x – 2*tamanio y – 2*tamanio x – 4*tamanio y – tamanio x – 2*tamanio y

Radio de:2*tamanio de 270 a 360 grados.

x + 6*tamanio, y

x + 4*tamanio, y

x 2*tamanio y + 2*tamanio

x +2 *tamanio

y +2 *tamanio

Circunferencias

Dibujo de una compuerta and

void dibujaAnd(int x, int y, int size){ int x1 = x-2*size; int y1 = y-2*size;

line(x1,y1,x1,y1+4*size);

line(x1,y1,x1+4*size,y1);

line(x1,y1+4*size,x1+4*size,y1+4*size);

line(x+4*size,y,x+5*size,y);

line(x-2*size,y+size,x-3*size,y+size);

line(x-2*size,y-size,x-3*size,y-size);

arc(x+2*size,y,0,90,2*size);

arc(x+2*size,y,270,360,2*size);

}

Circunferencias Dibujo de una compuerta and void dibujaAnd(int x, int y, int size){ int x1 =

Circunferencias

Dibujo de una compuerta or

Circulo con centro en: x-4*tamanio, y Radio de:4*tamanio. viewport(x-2*tamanio,y-2*tamanio, Centro de la compuerta: x, y x+6*tamanio,y+2*tamanio)
Circulo con centro en: x-4*tamanio, y
Radio de:4*tamanio.
viewport(x-2*tamanio,y-2*tamanio,
Centro de la compuerta: x, y
x+6*tamanio,y+2*tamanio)
x – 2*tamanio
y – 2*tamanio
x,y – 2*tamanio
x
– 4*tamanio
Arco con centro en: x, y+2*tamanio
Radio de:4*tamanio de 0 a 90 grados.
y – tamanio
viewport(x,y-2*tamanio,x+6*tamanio,y)
x
– 2*tamanio
y – tamanio
Arco con centro en: x, y - 2*tamanio+1
Radio de:2*tamanio de 270 a 360 grados.
viewport(x,y,x+6*tamanio,y+2*tamanio)
x
+ 4*tamanio
y + tamanio
x + 4*tamanio*cos(30)+tamanio, y
x +2*tamanio
y +tamanio
x + 4*tamanio*cos(30), y
x – 2*tamanio
x, y +2 *tamanio
y +
2*tamanio

Circunferencias

Función para dibujar compuerta or

void dibujaOr(int x, int y, int size){ arccoordstype arco; int x1 = x-2*size; int y1 = y-2*size; int xp,yp;

line(x1,y1,x1+2*size,y1);

line(x1,y1+4*size,x1+2*size,y1+4*size);

//arco superior delantero

setviewport(x,y-2*size,x+4*size,y,true);

arc(0,4*size,0,90,4*size);

//arco inferior delantero

setviewport(x,y,x+4*size,y+2*size+1,true);

arc(0,-2*size+1,270,360,4*size);

//arco trasero

setviewport(x-2*size,y-2*size,x,y+2*size,true);

xp = -(int)sqrt(4*size*4*size-4*size*size);

circle(xp,2*size,4*size);

setviewport(0,0,getmaxx(),getmaxy(),true);

Circunferencias

//conexiones traseras

xp = x1+xp+(int)sqrt(4*size*4*size-size*size);

line(xp,y1+size,xp-size,y1+size);

line(xp,y1+3*size,xp-size,y1+3*size);

//conexione delantera

xp = x+(int)(4*size*cos(30*pi/180));

yp = y-2*size+(int)(4*size*sin(30*pi/180)); line(xp,yp,xp+size,yp);

}

Circunferencias //conexiones traseras xp = x1+xp+(int)sqrt(4*size*4*size-size*size); line(xp,y1+size,xp-size,y1+size); line(xp,y1+3*size,xp-size,y1+3*size); //conexione delantera xp = x+(int)(4*size*cos(30*pi/180)); yp = y-2*size+(int)(4*size*sin(30*pi/180));

Circunferencias

Tarea

Basándose en las primitivas de compuertas and y or

escriba funciones para dibujar estas compuertas con

diferentes orientaciones: hacia arriba, hacia la

izquierda y hacia abajo.

Otras primitivas

Rectángulos rellenos

Los rectángulos rellenos pueden generarse fácilmente

haciendo un barrido de líneas de rastreo desde la

primera coordenada y a la segunda. El siguiente

código hace este trabajo:

void Rectangulo(int x1,int y1,int x2,int y2){

int i;

for(i = y1;i<=y2; i++)

line(x1, i, x2, i);

}

Otras primitivas

Relleno de polígonos: el relleno opera calculando los

tramos que se hallan entre la arista de la izquierda y

la derecha del polígono. El algoritmo requiere

conservar una lista ordenada respecto a y de las

aristas activas en cada fase del proceso.

Recorte de círculos: Se puede recortar todo el círculo

respecto a un rectángulo. Si el círculo lo intercepta,

se divide en cuadrantes y se aplica la prueba de

aceptación o rechazo trivial para cada uno.

También se aceptar y rechazar a nivel de píxel.

Texto: el texto puede definirse mediante mapas de

bits para cada conjunto de caracteres. Se dibuja

usando la función CopyPixel del sistema.

Otras primitivas

Otras primitivas en C

void bar (int left, int top, int right, int bottom); void bar3d (int left, int top, int right, int bottom, int depth, int topflag); void drawpoly (int numpoints, int *polypoints); void fillellipse (int x, int y, int xradius, int yradius); void fillpoly (int numpoints, int *polypoints); void floodfill (int x, int y, int border); void pieslice (int x, int y, int stangle, int endangle, int radius); void rectangle (int left, int top, int right, int bottom); void sector (int x, int y, int stangle, int endangle, int xradius, int yradius); void setfillpattern (char *upattern, int color); void setfillstyle (int pattern, int color); void setlinestyle (int linestyle, unsigned upattern, int thickness);

Otras primitivas

Algoritmo pastel

Algoritmo para dibujar un diagrama de pastel.

1. Iniciar ang = 0

  • 2. Sum = suma de valores a representar

  • 3. Para todos los valores hacer

  • 4. Poner color del sector

  • 5. Dibujar sector desde ang/suma*360 hasta (ang + valor)

/suma*360

  • 6. Incrementar ang en valor

  • 7. Fin para

Otras primitivas Algoritmo pastel Algoritmo para dibujar un diagrama de pastel. 1. Iniciar ang = 0

Otras primitivas

Ejemplo, diagrama de pastel

#include <graphics.h>

void pastel(int n, float *a, int x, int y, int r){

float suma = 0,ang = 0; int i; for(i = 0; i<n; i++) suma +=a[i];

for(i = 0; i<n; i++){

setfillstyle(1,i+1);

sector(x,y,(int)(ang/suma*360),(int)((ang+a[i])/suma*360),r,r);

ang += a[i];

}

} main(){ float a[]={25.3,35.2,56.1,48.7,13.6};

initwindow(200,200);

pastel(5,a,100,100,60);

getch(); return 0;

}

Otras primitivas Ejemplo, diagrama de pastel #include <graphics.h> void pastel(int n, float *a, int x, int

Atributos de primitivas

Atributos de línea

Atributos de relleno

Atributos de primitivas

Atributos de líneas

En bgi existen tres atributos para las líneas:

color

grosor

patrón

Atributos de primitivas

Color

El color se establece con setcolor(int color). Existen 16 colores predefinidos, del 0 al 15:

BLACK BLUE

GREEN

RED

MAGENTA

BROWN

DARKGRAY

LIGHTBLUE

LIGHTGREEN

LIGHTRED

LIGHTMAGENTA YELLOW WHITE

CYAN

LIGHTGRAY

LIGHTCYAN

La función COLOR(r, g, b) permite obtener cualquier color dados los valores las componentes de rojo, verde y azul. La función converttorgb(c) convierte a RGB de Windows.

RED_VALUE(v) regresa el valor de rojo de un color GREEN_VALUE(v) regresa el valor de verde de un color BLUE_VALUE(v) regresa el valor de azul de un color IS_BGI_COLOR(v) regresa verdadero si el color es BGI IS_RGB_COLOR(v) regresa verdadero si el color es RGB

Atributos de primitivas

Grosor y patrón

Existen dos grosores de línea predefinidos, pero puede usarse

cualquier valor:

NORM_WIDTH THICK_WIDTH Los patrones de línea son:

1

3

SOLID_LINE, DOTTED_LINE, CENTER_LINE, DASHED_LINE, USERBIT_LINE La función:

setlinestyle(int linestyle,unsigned upattern,int thickness );

Establece el tipo de línea. El patrón definido por el usuario se

establece con el entero sin signo upattern, cada bit de este entero de 16 bits especifica si se pinta o no un pixel.

Atributos de primitivas

Actividad

Defina los siguientes patrones de línea, dibuje

algunas líneas con estos patrones:

Atributos de primitivas Actividad Defina los siguientes patrones de línea, dibuje algunas líneas con estos patrones:
Atributos de primitivas Actividad Defina los siguientes patrones de línea, dibuje algunas líneas con estos patrones:
Atributos de primitivas Actividad Defina los siguientes patrones de línea, dibuje algunas líneas con estos patrones:

Atributos de primitivas

Patrones de relleno de áreas

Para relleno de áreas existen los siguientes patrones predefinidos:

EMPTY_FILL, SOLID_FILL, LINE_FILL, LTSLASH_FILL, SLASH_FILL, BKSLASH_FILL, LTBKSLASH_FILL, HATCH_FILL,

XHATCH_FILL, INTERLEAVE_FILL, WIDE_DOT_FILL,

CLOSE_DOT_FILL, USER_FILL

La función setfillstyle(int pattern,int color) define el patrón de relleno y el color. El relleno definido por el usuario se establece con setfillpattern( char *upattern,int color) el patrón de 8x8 se define mediante un arreglo de 8 caracteres. El siguiente ejemplo rellena con corazoncitos:

char pattern[] = {0x66,0x99,0x81,0x81,0x42,0x24,0x18,0x00}; setfillpattern( pattern, 15 ); bar(200,200,300,300);
char pattern[] =
{0x66,0x99,0x81,0x81,0x42,0x24,0x18,0x00};
setfillpattern( pattern, 15 );
bar(200,200,300,300);

Atributos de primitivas

Actividad

Defina los siguientes patrones de línea y dibuje

algunas figuras con estos patrones:

Atributos de primitivas Actividad Defina los siguientes patrones de línea y dibuje algunas figuras con estos
¿Para que me sirve ¿Cuáles son los temas estudiados el día de hoy? y como lo
¿Para que me sirve
¿Cuáles son los
temas estudiados
el día de hoy?
y como lo aplicaría
en mi vida
profesional y
personal?

Tópico II

Unidad I

Primitivas gráficas y algoritmos

Semana 2

Algoritmos para dibujar primitivas gráficas