Aula 4: Clipping (Recorte)

(1)

Computação Gráfica:

Aula 4: Clipping (Recorte)

Métodos, Técnicas e Algoritmos para Cálculo de

Visualização em 2D

Prof. Dr. rer.nat. Aldo von Wangenheim

(2)

Capítulo 4: Objetivos

Aprenderemos:

• Windows genéricos em 2D

• View Up Vector

• Sistema de Coordenadas Normalizado ou de

Window

(3)

4.1. Sistema de Coordenadas

Normalizado

(4)

As entidades de Visualização (recapitulando):

• Window

(estr.dados - janela)

• _{Uma área de world-coordinates (coordenadas do mundo)}

selecionada para ser mostrada.

• Viewport

(estr.dados - área de desenho da tela)

• _{Uma área em um dispositivo de display para a qual o conteúdo de}

uma window é mapeado.

• Transformação de visualização

(transformação - viewing

transform)

• _{O mapeamento de uma parte de uma cena em coordendas do}

mundo para coordenadas de dispositivo.

(5)

Transformada Window-to-Viewport

Window

(

v

) yw

_max_max

yw

_min_min

(xw, yw)

xv

_min_min

xv

_max_max

yv

_min_min

yv

_max_max

Viewport

(xv, yv)

Coordenadas do Dispositivo

Coordenadas do Mundo

(6)

Visualização de Mundos Complexos em duas dimensões

yv

_min_min

yv

_max_max

xv

_min_min

xv

_max_max

Viewport

Coordenadas do Dispositivo

Window

xw

yw

_max_max

yw

_min_min

Coordenadas do Mundo

(7)

Desvantagens do mapeamento direto window->viewport

• Navegação limitada.

• Eixos de coordenadas de window e de viewport são

sempre paralelos

• _{Transformada de viewport é apenas um transformação de}

escala

(8)

Efeitos de Visualização com Window

• Efeito de Zooming

• _{Mapeamento sucessivo de windows de tamanho}

diferente em viewports de tamanho fixo.

• Efeito de Panning

• _{Movimentação de uma window de tamanho fixo}

através de vários objetos em uma cena.

• Importante: Independência de dispositivo

• _{Windows são tipicamente definidas dentro de um}

(9)

Window):

• Window: Para permitir todos os graus de liberdade na

navegação no mundo, uma window deveria ser um

retângulo com qualquer orientação

• _{Até agora vimos apenas windows paralelas ao sistema de}

coordenadas do mundo.

• _{Para extendermos uma window de forma a podermos realizar o}

efeito de panning, mesmo em 2D, temos de definir um

terceiro

sistema de coordenadas intermediário

, entre o sistema de

coordenadas do mundo e o sistema de coordenadas do vídeo.

• _{Este sistema de coordenadas é chamado de}

_{sistema de}

coordendas normalizado

ou sistema de coordenadas de plano

de projeção.

(10)

yv

_min_min

yv

_max_max

xv

_min_min

xv

_max_max

Viewport

Coordenadas do Dispositivo

Window

xw

yw

_max_max

yw

_min_min

Coordenadas do Mundo

Visualização de Mundos Complexos em duas dimensões

(11)

yv

_min_min

yv

_max_max

xv

_min_min

xv

_max_max

Viewport

Coordenadas do Dispositivo

Window

yw

_max_max

yw

_min_min

Coordenadas do Mundo

Visualização de Mundos Complexos em duas dimensões

(12)

Visualizando o Sistema de Coordenadas Normalizado

• Esquema de referência para a especificação do

window em relação às coordenadas do mundo:

• Origem das coordenadas de visualização:

P

₀

= (x

₀

, y

₀

)

• View up vector

V: Define a direção y

_v

de visualização

y

mundo

v

u

y

y visualização

x

x visualização

(x

₀₀

, y

₀₀

)

Origem: p

₀

= (x

₀

, y

₀

)

Eixo y

_v

: v = (v

_x

, v

_y

)

Eixo x

_v

: u = (u

_x

, u

_y

)

(13)

Window

yw

₄₄

yw

₁₁

v

_up_up

u

y

visualização

_{x visualização}

_x

(Wc

_x_x

, Wc

_y_y

)

(14)

Implicações do Sistema de Coordenadas

Normalizado

• Cada objeto do mundo é representado em

dois sistemas de coordenadas:

• Coordenadas do Mundo

: suas coordenadas reais

• _{Abreviamos por WC - World Coordinates}

• _{Coordenadas Normalizadas}

_{: coordenadas do}

objeto expressas em termos de

u

e

v

e com

origem em

(Wc

_x

, Wc

_y

)

(15)

Normalizado

?

• Para tornar um sistema independente do tamanho

da viewport e facilitar alguns algoritmos, usava-se

normalizar as coordenadas dos objetos

• _{Fixava-se os extremos da window em (-1,-1),(1,1)}

• _{Ao se transformar de um sistema de coordenadas para o}

outro, normalizava-se os objetos

• _Vantagem

_{: tudo que possuir uma coordenada fora do}

intervalo [-1,1] está fora da window.

• _Desvantagem

_{: qualquer operação de navegação ou}

zoom implica em uma nova transformação de

normalização de coordenadas.

(16)

Alternativas ao Sistema de Coordenadas Normalizado

• Podemos continuar a representar a window em

termos da unidade de medida das coordenadas do

mundo:

sistema de coordenadas de plano de

projeção - PPC

.

• Mantemos a unidade de medida do mundo.

• _{Muito menos divisões}

• Representamos

v

_up

por (

_xw

₁

,

_yw

₁

)(

_xw

₂

,

_yw

₂

) ao

(17)

Window

yw

₂₂

yw

₁₁

v

_up_up

(Wc

_x_x

, Wc

_y_y

)

(18)

Alternativas ao Sistema de Coordenadas Normalizado

• PPC

: Transformamos o sistema de coordenadas

para um sistema com origem em W

_c

e eixos

paralelos aos limites da Window

• Se

v

_up

for paralelo ao eixo Y, apenas

transladamos

W

_c

para a origem e aplicamos a

transformada de viewport.

• Se

v

_up

não for paralelo ao eixo Y, rotacionamos

o mundo e a window em torno de (

Wc

_x

, Wc

_y

) por

(19)

0. Crie ou mova a Window onde desejar.

1. Translade

Wc

para a origem

• Transladar o mundo de [-Wc

_x

, -Wc

_y

]

2. Determine

v

_up

e o ângulo de

v

_up

com Y

3. Rotacione o mundo de forma a alinhar

v

_up

com o eixo Y

• _{Rotacione o mundo por -}

θ

_(Y,

_v

_up

₎

4. Armazene as coordenadas CPP de cada objeto.

5. Armazene as coordenadas CPP da Window.

• _{Você vai usar na transformada de Viewport.}

(20)

Window

xw

yw

₂₂

yw

₁₁

v

_up_up

(Wc

_x_x

, Wc

_y_y

)

Algoritmo Gerar Descrição em PPC

Dy

Dx

(21)

Window

v

_up_up

(Wc

_x_x

, Wc

_y_y

)

(22)

Window

v

up up

(Wc

x x

, Wc

y y

)

u

v

(23)

Como representar e usar o PPC ?

• Altere o display file

. Cada objeto gráfico de seu

display file passará a possuir dois conjuntos de

coordenadas:

• _{as coordenadas do mundo - WC}

• _{as PPC}

• Altere a definição da Window:

• _{Será representada por dois conjuntos de coordenadas}

também: WC e PPC

• Utilize a representação em PPC dos objetos e da

window para a transformada de Viewport.

(24)

Como eu navego no Mundo usando o PCC ?

• O referencial do usuário que está sentado ao

computador é o

PPC

• _{Calcule o deslocamento da window no PPC}

• _{Ex.: “seta para cima” faz window mover 10 unidades na}

direção

V

_up

.

• Mova a Window em termos de

WC

• _{Transforme movimento resultante para WC}

• _{Mude a posição ou orientação da window no WC}

(25)

Deslocamento Linear

y

_WC_WC

(Wc

_x_x

, Wc

_y_y

)

10 uni

dad

es

(26)

Deslocamento Linear

y

_WC_WC

(Wc

_x_x

, Wc

_y_y

)

x

_WC_WC

V

(27)

Como implementar a translação da window quando

estiver em uma orientação não paralela aos eixos ?

• Ex.: Considere o desenho anterior

• _{cada toque em um botão “seta para cima” faz a window se}

mover 10 unidades no PPC

• _{O vetor de deslocamento}

_V

_{é um vetor de mesma direção}

e sentido que

V

_up

e norma 10.

• V

_up

em WC você tem: são os limites da window.

• Um procedimento possível:

• Translade

V

_up

em

WC

para a origem.

• Calcule um vetor de módulo 10 sobre

V

_up

(28)

Rotação

y

_WC_WC

(Wc

_x_x

, Wc

_y_y

)

x

_WC_WC

(29)

Rotação

y

(30)

Rotação

yv

_min_min

yv

_max_max

xv

_min_min

xv

_max_max

Viewport

(31)

Como implementar a rotação da window durante a

navegação ?

• Considere a window como um objeto gráfico

qualquer e aplique a rotação de objetos sobre um

ponto arbitrário à window em

WC

.

• Recalcule as coordenadas do mundo em

PPC

aplicando o algoritmo

Gerar Descrição em PPC

• _{Observe que o mundo será girado na direção contrária}

(32)

Computação Gráfica:

4.2. Clipping

(33)

O que é clipping?

• Clipping é um procedimento para o particionamento

de primitivas geométricas:

• _{Distinguir se primitivas geométricas estão dentro ou fora}

do

viewing frustum

(regiões do espaço especificadas)

• _{Distinguir se primitivas geométricas estão dentro ou fora}

do

picking frustum

• _{Detectar intersecções entre primitivas}

(34)

Por quê recortamos ?

• Clipping é uma otimização importante:

• É o

preprocessamento de visibilidade

.

• Em cenas de mundo real o clipping remove uma

porcentagem considerável do ambiente

representado.

• _{Assegura que somente primitivas potencialmente}

(35)

Conceitos de Clipping (Recorte)

• Clip window

• A região para a qual um objeto deve ser

recortado.

• _{A forma geométrica de recorte.}

• Sempre realizamos recorte em

coordenadas da Clip Window

• _{No nosso caso utilizaremos a representação}

(36)

Conceitos de Clipping (Recorte)

• Tipos de clipping

• Point clipping

• Line clipping

• Area (Polygon) clipping

• _{Curve clipping}

(37)

Operações de Clipping (Recorte)

• Point clipping (p/clip window retangular)

• _{Processo rápido e muito simples. O ponto que deve}

ser apresentado na viewport é aquele para o qual

as

inequações

abaixo

são

satisfeitas:

• Implementado por toda componente de superfície de

desenho de linguagens de programação, como os

subcanvas ou canvas

(38)

Clipping de Linhas

• Relacionamentos possíveis com uma clipping

region retangular

P

₁

P

2

P

₃

P

₄

P

₅

P

₆

P

₇

P

₈

P

₉

P

₁₀

Antes do Clipping

P

₁

P

2

P’

₅

P

6

P’

₇

P’

₈

Depois do Clipping

(39)

• Relacionamentos possíveis

• _{Completamente dentro do window de clipagem}

(

desenhamos

)

• _{Completamente fora do window}

(

não desenhamos

)

• _{Parcialmente dentro do window}

(

o que desenhamos ?

)

Clipping de Linhas

(40)

• Checagem por meio da equação paramétrica envolvendo os

limites da janela e a própria linha.

• _{Grande quantidade de cálculos e teste e não é muito}

eficiente. Num display típico, centenas ou milhares de

linhas de linha podem ser encontradas.

• _{Algoritmo eficiente:}

• _{Deve promover alguns testes iniciais de forma a}

determinar se cálculos de interseção são realmente

necessários.

• _{Par de pontos finais pode ser checado para observar se}

ambos pertencem à janela.

Clipping de Linhas usando representação paramétrica da reta

(41)

• Representação paramétrica da reta

• _{Usamos o valor de u para calcular a intersecção com}

uma das bordas do retângulo definido pelo window

• _{Fora: < 0 ou > 1}

• _{Dentro: de 0 a 1}

• _{Se o valor da intersecção for maior que o tamanho do}

window, a intersecção ocorrerá em algum lugar fora

deste.

x = x

₁

+ u(x

₂

- x

₁

)

y = y

₁

+ u(y

₂

- y

₁

)

Clipping de Linhas usando representação paramétrica da reta

(42)

Recorte de Linhas de Cohen-Sutherland

• Código de regiões

• _{Código binário de 4 dígitos atribuído a todo ponto final}

de uma linha na figura: region codes (RC)

• _{Numeramos as posições no código de regiões de 1 a 4.}

Cantos são representados por soma de valores.

0 0 0 0

Window

1 0 0 1

0 0 0 1

0 1 0 1

1 0 0 0

1 0 1 0

0 0 1 0

0 1 1 0

0 1 0 0

RC[1]: acima

RC[2]: abaixo

RC[3]: direita

RC[4]: esquerda

(43)

• Valores dos

region codes

• _{Determinados através da comparação das coordenadas}

das extremidades aos limites da window.

• _{Valor 1 in em qquer posição: O ponto está neste}

quadrante.

• _Determinado:

• _{Calcule as diferenças entre coordenadas das}

extremidades e limites de clipagem.

• _{Use o sinal resultante para montar o código, setando}

o valor do bit correspondente.

Recorte de Linhas de Cohen-Sutherland

(44)

P

₁

P

₂

P’

₂

P’’

2

P

₃

P

₄

P’

₃

• Possíveis relacionamentos:

• _{Completamente contida na janela}

• _{0000 para ambas as extremidades}

• _{Completamente fora da janela}

• _{And logico dos}

_{region codes}

_{para ambas as extremidades}

resulta diferente de 0000

• _Parcialmente

• _{Extremidades possuem}

_region

codes

diferentes

• _{And logico dos}

_{region codes}

para ambas as extremidades

resulta em 0000

Recorte de Linhas de Cohen-Sutherland

(45)

(46)

Algoritmo Geral para Recorte de Linhas de Cohen-Sutherland

P1

: Associar códigos aos pontos extremos c/regra:

Para as coordenadas X de ambos os pontos da linha:

se x

_i

< X

_wesq

então RC

_i

[4] <- 1 senão RC

_i

[4] <- 0

se x

_i

> X

_wdir

então RC

_i

[3] <- 1 senão RC

_i

[3] <- 0

Para as coordenadas Y de ambos os pontos da linha:

se y

_i

< Y

_wfundo

então RC

_i

[2] <- 1 senão RC

_i

[2] <- 0

se y

_i

> Y

_wtopo

então RC

_i

[1] <- 1 senão RC

_i

[1] <- 0

(47)

Algoritmo Geral para Recorte de Linhas de Cohen-Sutherland

• P2: Verificar se a linha é totalmente visível ou

invisível ou parcialmente visível

Completamente contida na janela

• RC

_inicio

= RC

_fim

= [0 0 0 0]

Completamente fora da janela

• RC

_inicio

& RC

_fim

<> [0 0 0 0]

Parcialmente

• RC

_inicio

<> RC

_fim

(48)

Algoritmo Geral para Recorte de Linhas de Cohen-Sutherland

• P3: Se a linha é parcialmente visível devem ser

calculadas as intersecções:

Esquerda: x

_E

, y = m* (x

_E

- x

₁

) + y

₁

;

M diferente de 0

Direita: x

_D

, y = m* (x

_D

- x

₁

) + y

₁

Topo:

y

_T

, x = x

₁

+ 1/m . (y

_T

- y

₁

)

(49)

Exemplo: P3

(10,10)

(10,20)

(25,10)

(25,20)

(15,17)

(5,12)

(15,23)

(5,18)

R1

R2

(50)

Clipando R1

• RC1 = [0 0 0 1] -> esquerda e RC2 = [0 0 0 0] -> dentro

• _{Clipamos apenas à esquerda e calculamos novo y1 para a linha.}

• Cálculo do coeficiente angular:

• _{m = (y2 - y1)/(x2 - x1) = (17 - 12)/(15 - 5) = 5 / 10 = 0.5}

• Aplicamos a fórmula esq.: y

_intersec

= m* (x

_E

- x

₁

) + y

₁

• y

_intersec

= 0.5 * (10 - 5) + 12 = 2.5 + 12 = 14.5

• Como 14.5 > y

_F

= 10 e 14.5 < y

_T

= 20

aceitamos

.

• Nova linha clipada é:

(51)

Clipando R2

• RC1 = [0 0 0 1] -> esquerda e RC2 = [1 0 0 0] -> topo

• _{Clipamos à esquerda e calculamos novo y1 para a linha.}

• _{Clipamos ao topo e calculamos novo x2 para a linha}

• Cálculo do coeficiente angular:

• _{m = (y2 - y1)/(x2 - x1) = (23 - 18)/(15 - 5) = 5 / 10 = 0.5}

• Aplicamos a fórmula esq.: y

_intersec

= m* (x

_E

- x

₁

) + y

₁

• y

_intersec

= 0.5 * (10 - 5) + 18 = 2.5 + 18 = 20.5

• Como 20.5 > y

_F

= 10

mas

20.5 não é

< y

_T

= 20

rejeitamos

.

• _{Intersecção é fora da window}

• _{Não é necessário calcular x2 - se uma intersecção for fora a outra}

também o será.

(52)

Resultado

(10,10)

(10,20)

(25,10)

(25,20)

(15,17)

(10,14.5)

R1’

(53)

O que eu faço neste caso ?

(10,10)

(10,20)

(25,10)

(25,20)

(54)

Quando um ponto cair em um dos cantos...

• Quando o RC associado a um ponto de uma linha

possuir dois “1”, calculamos a intersecção com as

bordas da window para os dois casos.

• _{No exemplo calcularíamos um x2 pelo topo e um y2 pela}

direita.

• Aceitamos dentre os dois valores calculados,

aquele que se encontrar sobre a window

• _{O outro estará fora.}

(55)

• Em 1978 Cyrus e Beck publicaram um novo algoritmo para

o clipping de linhas usável para clipar linhas contra um

polígono convexo em 2D ou um poliedro convexo em 3D

usando a equação paramétrica.

• Em 1984 Liang e Barsky reformularam este algoritmo,

tornando-o mais eficiente.

• _{Esta versão veremos a seguir.}

Clipping de Linhas de Liang-Barsky

(56)

• Reescreva as equações paramétricas como segue:

• Sendo as condições de clipagem já vistas:

• _{Cada uma dessas inequações pode então ser expressa como:}

1

0 ,

1

1 ≤

≤

∆

+

=

∆

+

=

u

y

u

y

x

u

x

max

min

max

min

yw

y

u

y

yw

xw

x

u

x

xw

≤

∆

+

≤

∆

+

≤

1

4 3,

2,

1,

k

,

=

≤

_k

k

q

up

Liang-Barsky Line Clipping

(57)

Liang-Barsky Line Clipping

• Onde os parâmetros p e q são definidos como:

1

4

1

3

1

2

1

4

3

2

1 ,

,

y

yw

q

yw

y

q

x

xw

q

xw

x

q

y

p

y

p

x

p

x

p

max

min

max

min

−

=

−

=

−

=

−

=

∆

=

∆

−

=

∆

=

∆

−

=

(58)

Condições

• p

_k

= 0, paralela a um dos limites:

• q

_k

<

0, fora dos limites

• q

_k

>=

0, dentro dos limites

• p

_k

<

0, a linha vem de fora para dentro

• p

_k

>

0, a linha vem de dentro para fora

Liang-Barsky Line Clipping

(59)

(x

₁

, y

₁

)

(x

₂

, y

₂

)

Liang-Barsky Line Clipping

(60)

• Os parâmetros u

₁

and u

₂

definem qual parte está

dentro do retângulo:

• O valor de u

₁

: de fora para dentro (p

_k

< 0)

• O valor de u

₂

: De dentro para fora (p

_k

> 0)

• Se u

₁

> u

₂

, a linha está completamente fora.

(

)

k

_p

q

r

s

'

r

,

max

u

₁

=

0 =

(

)

k

_p

q

r

s

'

r

,

min

u

₂

=

1 =

Liang-Barsky Line Clipping

(61)

(x

₁

, y

₁

)

(x

₂

, y

₂

)

r

₁

r

₄

r

2

p

₁

< 0, p

₃

<0

u

₁

= max(0, r

₁

, r

₃

)

= r

₁

p

₂

> 0, p

₄

> 0

u

₂

= min(1, r

₂

, r

₄

)

= 1

Liang-Barsky Line Clipping

(62)

Exemplo usando Liang-Barsky

(10,10)

(10,20)

(25,10)

(25,20)

(15,17)

(5,12)

(15,23)

(5,18)

R1

R2

(63)

Calcular p e q para R1

• p1 = -

_∆

x = -(15 - 5) = -10

• p2 =

_∆

x = 15 - 5 = 10

• p3 = -

_∆

y = -(17 - 12) = -5

• p4 =

_∆

y = 17 - 12 = 5

• q1 = x1 - x

_wmin

= 5 - 10 = -5

• q2 = x

_wmax

- x1 = 25 - 5 = 20

• q3 = y1 - y

_wmin

= 12 - 10 = 2

• q4 = y

_wmax

- y1 = 20 - 12 = 8

(64)

Calcular u1 para R1

• p1 = -10 < 0

• p3 = -5 < 0

• r1 = q1/p1 = -5/-10 = 0.5

• r3 = q3/p3 = 2/-5 = - 0.4

• u1 = max (

0 , r1, r3) = max (

0 , 0.5, -0.4) = 0.5

Substituindo na eq.paramétrica:

• x = 5 + 0.5 * 10 = 10 (o que nós já sabíamos)

• y = 12 + 0.5 * 5 = 14.5 (o que nós não sabíamos)

1

0 ,

1

1 ≤

≤

∆

+

=

∆

+

=

u

y

u

y

x

u

x

(65)

Calcular u2 para R1

• p2 = 10 > 0

• p4 = 5 > 0

• r2 = q2/p2 = 20/10 = 2

• r4 = q4/p4 = 8/5 = 1.6

• u2 = min (

1 , r1, r3) = min (

1 , 2, 1.6) =

1 • Como u2 resulta

1 , rejeitamos o cálculo de novos valores de

(66)

Nicholl-Lee-Nicholl Line Clipping

• Comparado aos algoritmos C-S e L-B:

• _{NLN realiza menos comparações e divisões.}

• _{NLN pode ser aplicado somente a 2D clipping.}

• O algoritmo NLN

• Clipa uma linha com extremas P

₁

e P

₂

• Passo 1: Determina P

₁

para os nove quadrantes.

• _{Somente três regiões são consideradas}

• _{Para o resto usa-se uma transformada de simetria}

• Passo 2: Depois determina-se a posição de P

₂

em

(67)

P

₁

P

₁

P

₁

Nicholl-Lee-Nicholl Line Clipping: Passo 1a

(68)

P

₁

T

L

B

R

P

₁

L

LT

LR

LB

P

₁₁

is inside the clip window

and P

₂₂

is outside

P

₁₁

is directly to the left

of the clip window

Nicholl-Lee-Nicholl Line Clipping: Passo 1b

Cálculo dos ângulos de uma linha hipotética de P1 aos cantos.

Determinar regiões L,T,R,L,TR,etc

(69)

P

₁

T

L

LB

TB

TR

P

₁

L

T

_TR

LR

LB

Nicholl-Lee-Nicholl Line Clipping: Passo 1b

Cálculo dos ângulos de uma linha hipotética de P1 aos cantos.

Determinar regiões L,T,R,L,TR,etc

(70)

• Para determinar em qual região P

₂

está:

• _{Compare-se a inclinação da reta com as}

inclinações das retas hipotéticas calculadas.

• Exemplo: P

₁

está à esquerda, P

₂

está em LT.

1

2

1

2

1

1 x

x

y

x

y

x

y

L

T

R

T

−

<

−

<

−

inclinação P

₁

P

_TR

<

inclinação P

₁

P

₂

< inclinação P

₁

P

_TL

Nicholl-Lee-Nicholl Line Clipping

(71)

Clip Windows Não Retangulares

• Algoritmos baseados em equações parametricas podem

ser extendidos a Polígonos Convexos

• _{Método de Liang-Barsky}

• _{Modifique o algoritmo para incluir as equações paramétricas de}

todas as bordas definidas pelo polígono de clipping.

• Métodos de Clipping de Regiões Côncavas

• _{Divida em um conjunto de Polígonos Convexos}

• _{Aplique métodos paramétricos}

• Círculos e outras regiões de clipagem curvas

(72)

Divisão de Polígonos Côncavos

• Identifique se um polígono é Côncavo

• _{Calcule o produto cruzado dos vetores de borda.}

• _{Uma componente z negativa resultante da multiplicação}

posicionada entre componentes positivas indica uma

concavidade local.

y

x

V

₁

_V

2

V

₃

V

₄

V

₅

V

₆

E

₁

E

2

E

₃

E

₄

E

₅

E

₆

(

)

(

)

(

)

(

)

(

)

(

)

0

1

6

5

4

3

2

1 >

×

>

×

>

×

<

×

>

×

>

×

z

E

(73)

Vetorial

• Calcule o produto cruzado dos vetores de

borda em sentido anti-horário.

• Se alguma componente Z for negativa:

• _{É côncavo.}

• _{Divida-o ao longo da primeira das duas linhas do}

produto cruzado:

E

₂

_E

3

E

₄

E

₅

E

₆

(74)

x

y

V

₁

V

₂

V

₃

V

₄

After rotating V

₃

onto the x axis, V

₄

is below the x axis.

Split the polygon along the line of V

₂

V

₃

.

Divisão de Polígonos Côncavos: Método da Rotação

(75)

Clipping de Polígonos

Clipping

de Linhas

Antes do clipping

Depois do clipping

Clipping

de Polígonos

(76)

Clipping de Polígonos de Sutherland-Hodgeman

• Processa as bordas do polígono como um todo

contra cada aresta do window

• _{Todos os vértices do polígono são processados contra}

cada uma das arestas do window

Original

Polygon

Clip

Left

Clip

Right

Clip

Bottom

Clip

Top

(77)

• Passe cada par de vértices adjacentes do polígono

a um clipador de linhas qualquer, criando novos

pontos em um novo polígono

• _{4 casos:}

V

₁

V’

1

V

2

V

2

V

₃

V

₃

V’

₃

V

₄

V

₄

V

₁

out in

in in

in out

out out

(78)

• Lista de vértices intermediários

• _{Cada vez que realizamos a clipagem para todos os}

vértices contra uma das 4 bordas do window,

regeneramos o polígono.

• _{Este novo polígono é clipado contra outra das 4 bordas}

do window.

• Polígonos convexos são tratados corretamente.

• Caso seja côncavo:

• _{Divida em subpolígonos côncavos}

(79)

• Desenvolvido para identificação de superfícies

visíveis

• _{Pode ser aplicado a uma região de clipagem arbitrária.}

• _{Pode ser usado para seguir as bordas de qualquer coisa}

com qualquer formato.

• Se processamos em sentido horário procedemos

assim:

• _{For an outside-to-inside pair of vertices,}

_{follow the}

polygon boundary

.

• _{For an inside-to-outside pair of vertices,}

_{follow the}

(80)

Clipagem de Polígonos de Weiler-Atherton

V

₁

V’

1

V

2

V

₃

V’

₃

V

₄

V’

₄

V

₅

V’

₅

V

₆

Depois do

Clipping

(81)

Outros Clippings

• Clipping de Curvas

• _{Use um casco convexo (retângulo) para testar.}

• _{Para o círculo}

• _{Use as coordenadas de quadrantes individuais (gere)}

• _{então use octantes (gere valores mais precisos)}

• Clipping de Texto

• _{All-or-none string-clipping: Pegar limites do casco}

convexo de um string.

• _{All-or-none character-clipping: Clipar carateres}

(82)

Clipping Exterior

• Salvar uma região externa

• Applicações

• _{Sistemas de windows múltiplos}

• _{Layouts de páginas para design}

(Corel, Photoshop,...)

• Utilizamos os procedimanetos de clipagem

usados para o interior de polígonos côncavos

(83)

V

₁

V

₂

V

₃

P

₁

P

₂

P’

₁

_P’

2

V

₁

V

₂

V

₃

V

₄

P

₁

P

₂

V

₅

V

₁

V

₅

P’

₁

P’’

1

P’

2

Clipping Exterior

(84)

Trabalho: Clipping - parte #1

• Extenda seu sitema gráfico interativo para realizar

navegação livre com a window

• _{Extenda o seu display file para comportar as coordenadas}

dos objetos em PPC paralelamente às coordenadas WC

• _{Faça o mesmo com a window}

• _{Implemente os algoritmos descritos em 4.1}

• _{Inclua botões de navegação adicionais que permitam a}

rotação da window

• _{Um clique no botão faz a window rodar para a direita}

(85)

Trabalho: Clipping - parte #2

• Extenda seu sitema gráfico interativo para realizar a

clipagem de seus elementos gráficos

• _{Defina uma subárea dentro de seu Subcanvas ou View}

que você utiliza para desenhar como sendo a área de

clipagem: uns 10 píxeis para dentro nos quatro cantos.

• _{Defina seu viewport como sendo essa área interna, que}

não vai mais começar em (0,0), mas sim em (10,10).

• _{Dessa forma você vai enxergar se o algo for desenhado}

fora da window/viewport porque o algoritmo de clipagem

nativo não vai cortá-lo nas bordas que você definiu.

(86)

Trabalho: Clipping

Subcanvas

(87)

Computação Gráfica:

Exercícios

de

Clipping

(88)

(10,20)

(89)

Parte 1: Cohen - Sutherland

0 0 0 0

Window

1 0 0 1

0 0 0 1

0 1 0 1

1 0 0 0

1 0 1 0

0 0 1 0

0 1 1 0

0 1 0 0

RC[1]: acima

RC[2]: abaixo

RC[3]: direita

RC[4]: esquerda

(90)

(10,20)

(30,30)

P1: (0,24)

P2: (16,14)

• RC: [0001, 0100] -> Esquerda, Abaixo

• Verificar se ocorrem intersecções!

(91)

m=



y

2 −

y

1 



x

₂

−

x

₁



=

14−24



16−0

=−0.625

• Coeficiente Angular:

• Calculando para a Esquerda:

y=m. x

_e

−

x

₁



y

₁

y=−0.625 .10−024

y=17.75

(92)

(10,20)

(30,30)

P1: (0,26)

P2: (16,26)

• RC: [0001, 0000] -> Esquerda, Centro

• Ocorre intersecção

• Aonde?

(93)

m=



y

2 −

y

1 



x

₂

−

x

₁



=



26−26



16−0

=0

• Coeficiente Angular:

• Calculando para a Esquerda:

y=m. x

_e

−

x

₁



y

₁

y=0.10−026

y=26

(94)

• Nova reta:

(10,20)

(30,30)

(95)

(10,20)

(30,30)

P1: (22,24)

P2: (38,24)

• RC: [0000, 0010] -> Centro, Direita

• Ocorre intersecção

• Aonde?

(96)

m=



y

2 −

y

1 



x

₂

−

x

₁



=



24−24



38−22

=0

• Coeficiente Angular:

• Calculando para a Esquerda:

y=m. x

_d

−

x

₁



y

₁

y=0.30−824

y=24

(97)

• Nova reta:

(10,20)

(30,30)

(98)

(10,20)

(30,30)

P2: (18,26)

P1: (34,26)

• RC: [0010, 1000] -> Direita, Topo

• Verificar se ocorrem intersecções!

(99)

m=



y

2 −

y

1 



x

₂

−

x

₁



=



36−26



18−34

=−0.625

• Coeficiente Angular:

• Calculando para a Direita:

y=m. x

_d

−

x

₁



y

₁

y=−0.625.30−3426

y=28.5

(100)

• Calculando para o Topo:

x=x

₁



1 m

. y

t

−

y

1 

x=34−

1

0.625 .30.26

x=27.6

(101)

(10,20)

(30,30)

P2: (

27.6 ,30)

P1`: (30,

28.5 )

(102)

(10,20)

(30,30)

P1: (-4,40)

P2: (-4,24)

• RC: [1001, 0001] -> “E” Lógico dá 0001

• Totalmente fora.

(103)

(10,20)

(30,30)

P1: (6,22)

P2: (36,12)

• RC: [0001, 0110] -> Esquerda, Abaixo-Direita

• Verificar se ocorrem intersecções!

(104)

m=



y

2 −

y

1 



x

₂

−

x

₁



=



12−22



36−6

=−0.3334

• Coeficiente Angular:

• Calculando para a Esquerda:

y=m. x

_e

−

x

₁



y

₁

y=−0.3334.10−622

y=20.6

(105)

• Calculando para a Direita:

fora da Window!

y=m. x

_d

−

x

₁



y

₁

y=−0.3334.30−622

y=14

14 y

_min

(106)

• Finalmente, calculando para o Fundo:

x=x

₁



1 m

. y

f

−

y

1 

x=6−

1 0.3334

.20−22

x=12

(107)

• Nova reta:

(10,20)

(30,30)

P1: (10,

20.666 )

(108)

Parte 2: Liang-Barsky

(x

₁

, y

₁

)

(109)

(10,20)

(30,30)

P1: (0,24)

(110)

p

₁

=−

x=−16

p

₂

=

x=16

p

₃

=−

y=−14−24=10

p

₄

=

y=−10

q

₁

=

x

₁

−

x

_min

=

0−10=−10

q

₂

=

x

_max

−

x

₁

=30−0=30

q

₃

=

y

₁

−

y

_min

=

24−20=4

q

₄

=

y

_max

−

y

₁

=

30−24=6

• p1, p2... q1, q2...

(111)

r

₁

=

q

1 p

₁

=

−10

−16

=0.625

r

₄

=

q

4 p

₄

=

6 −10

=−0.6

u

₁

=

max 0, r

_1,

r

₄

=

0.625 • u1 – valores menores do que zero – p1 e p4

(112)

r

₂

=

q

2 p

₂

=

30

16 =1,875

r

₄

=

q

4 p

₄

=

4

10 =

0,4

u

₂

=

min1,r

_2,

r

₃

=

0,4

• u2 – valores menores do que zero – p2 e p3

u₁

(113)

(10,20)

(30,30)