Sumário. Gráficos 3D - Evolução Histórica. Computação Gráfica. ! Criação de Gráficos. ! Criação de Modelos 3D. ! Pipeline Gráfico. !

Tamanho: px

Começar a partir da página:

Download "Sumário. Gráficos 3D - Evolução Histórica. Computação Gráfica. ! Criação de Gráficos. ! Criação de Modelos 3D. ! Pipeline Gráfico. !"

Diogo Bayer Silva
6 Há anos
Visualizações:

1 Gráficos 3D - Evolução Histórica Computação Gráfica Sumário! Criação de Gráficos! Criação de Modelos 3D! Pipeline Gráfico! Hardware Gráfico! Bibliotecas Gráficas! Gráficos 3D na Internet 1

representing/controlling the way things move! Rendering!

2 Criação de Gráficos (Três tópicos)! Modeling! how to represent objects;! how to build those representations Animação e Realidade Virtual! Animation! representing/controlling the way things move! Rendering! how to create images Computação Gráfica Criação de Gráficos! Pressupõe a existência de um dispositivo de saída! Monitor! CRT (Cathode Ray Tube)! LCD (Liquid Crystal Display)! LED (Light Emitting Diode) 2

3 Resolução! A resolução de um monitor indica o número de pixeis.! O que é um Pixel? Por exemplo:! VGA 640x480! SVGA 800x600! XGA 1024x768! WXGA 1280x1024!! HD 1280 x 720! Full HD 1920 x 1080! 4K 3840 x 2160! Resolução! A resolução de um monitor indica o número de pixeis.! O que é um Pixel? Por exemplo:! VGA 640x480! SVGA 800x600! XGA 1024x768! WXGA 1280x1024!! HD 1280 x 720! Full HD 1920 x 1080! 4K 3840 x 2160!! Mas então como é que um monitor pode ter várias resoluções? 3

Resolução!! É o número de pixéis usados para representar uma imagem. Determina quer o nível de detalhe quer os requisitos de armazenamento.

5 KB em memória (ficheiro).! Imagem monocromática em tons de cinzento:! Cada pixel é armazenado num byte (0 a 255).! Uma imagem em tons de cinzentos 640 480 ocupa 300 KB em memória (ficheiro).

! Uma imagem a cores de 8-bits com resolução 640 480 ocupa 300 KB em memória (ficheiro).! Imagem a cores de 24-bits:! Cada pixel é representado por três bytes (e.g., RGB).

4 Resolução!! É o número de pixéis usados para representar uma imagem. Determina quer o nível de detalhe quer os requisitos de armazenamento Profundidade da cor (Colour depth) Imagem monocromática a preto e branco:! Cada pixel é armazenado num bit (0 ou 1).! Uma imagem monocromática ocupa 37.5 KB em memória (ficheiro).! Imagem monocromática em tons de cinzento:! Cada pixel é armazenado num byte (0 a 255).! Uma imagem em tons de cinzentos ocupa 300 KB em memória (ficheiro).! Imagem a cores de 8-bits:! Cada pixel é armazenado num byte.! Suporta 256 cores, com qualidade de cor aceitável.! Uma imagem a cores de 8-bits com resolução ocupa 300 KB em memória (ficheiro).! Imagem a cores de 24-bits:! Cada pixel é representado por três bytes (e.g., RGB).! Suporta cores ( ).! Uma imagem a cores de 24-bits com resolução ocupa 900 KB em memória (ficheiro).! Muitas imagens a cores de 24-bits são armazenadas como imagens de 32-bits, sendo o byte suplementar usado para guardar um valor alpha.! 2 níveis (escala: 0-1) 256 níveis (escala: 0-255) formato GIF (8 bits) formato JPEG (24 bits) 4

Profundidade da cor http://en.wikipedia.

5 Profundidade da cor 1 bit 4 bit 8 bits 24 bits Criação de modelos 3D! Modelação tridimensional! Malhas de pontos;! Curvas e superfícies;!! Mas quando os dados são enviado para a placa gráfica! Tudo se transforma em TRIÂNGULOS 5

Aplicação de transformações geométricas aos vértices!

6 TRIÂNGULO! É o polígono mais simples e tudo pode ser construído com base em triângulos! Logo é suficiente! É um polígono convexo! Logo mais fácil de pintar! É garantidamente plano! Logo não levanta ambiguidades Pipeline Gráfico! Aplicação de transformações geométricas aos vértices! Para posicionar os modelos e criar um cenário 3D;! Escolhe-se a vista pretendida do cenário através do posicionamento de uma câmara;! Faz-se a projecção de 3D para 2D; + TG( ) = 6

Escolhe-se a vista pretendida do cenário através do posicionamento de uma câmara;!

7 Pipeline Gráfico! Aplicação de transformações geométricas aos vértices! Para posicionar os modelos e criar um cenário 3D;! Escolhe-se a vista pretendida do cenário através do posicionamento de uma câmara;! Faz-se a projecção de 3D para 2D;! Faz-se o preenchimento dos triângulos! Iluminação e materiais Pipeline Gráfico Créditos: A. Fernandes, Univ. Minho 7

8 Hardware Gráfico! Controladores VGA (Video Graphics Array)! Introduzido pela IBM em 1987! Todo o processamento é realizado pelo CPU.! O VGA é utilizado somente como frame buffer. Hardware Gráfico! GPU (Graphics Processing Unit)! Termo introduzido pela nvidia em 1990! 1ª Geração de GPUs! até 1998 (nvidia TNT2, ATI Rage)! Interpolação: capacidade para calcular os pixeis a partir dos vértices de um triângulo e aplicar texturas. 8

9 Hardware Gráfico! GPU (Graphics Processing Unit)! 2ª Geração de GPUs! (GeForce 256, GF 2, Radeon 7500)! Transformação de Vértices! Cálculo de Iluminação (por vértice) Hardware Gráfico! GPU (Graphics Processing Unit)! 3ª Geração de GPUs! 2001 (GeForce 3 e 4, Radeon 8500)! Programação ao nível dos vértices (Vertex Shader)! 4ª Geração de GPUs! (GeForce FX, ATI Radeon 9700)! Programação ao nível do pixel (Pixel Shader) 9

Hardware Gráfico! GPU (Graphics Processing Unit)! 5ª Geração de GPUs! 2008-.

10 Hardware Gráfico! GPU (Graphics Processing Unit)! 5ª Geração de GPUs! ! Programação ao nível da criação de geometria (Geometry Shader). Pipeline Gráfico Créditos: A. Fernandes, Univ. Minho 10

11 Pipeline Gráfico GPU Créditos: A. Fernandes, Univ. Minho GPUs NVIDIA! GeForce GTX 295! GeForce 8800 GTX / GTS! (768MB/640MB ou 320MB)! Suporta Microsoft DirectX 10 Programming using CUDA Technology 11

Config 8 GB GDDR5X Memory Interface Width 256-Bit Memory Bandwidth (GB/sec) 320 Technology Support: Simultaneous Multi-Projection 10 Gbps VR Ready Yes NVIDIA

12 GPUs NVIDIA! GeForce GTX 690 GPUs NVIDIA! GEFORCE GTX 1080 GPU Engine Specs: NVIDIA CUDA Cores 2560 Base Clock (MHz) 1607 Boost Clock (MHz) 1733 Memory Spec: Memory Speed 10 Gbps Standard Memory Config 8 GB GDDR5X Memory Interface Width 256-Bit Memory Bandwidth (GB/sec) 320 Technology Support: Simultaneous Multi-Projection 10 Gbps VR Ready Yes NVIDIA Ansel Yes NVIDIA SLI Ready1 Yes - SLI HB Bridge Supported NVIDIA G-Sync -Ready Yes NVIDIA GameStream -Ready Yes NVIDIA GPU Boost 3.0 Microsoft DirectX 12 API with feature level 12_1 Vulkan API Yes OpenGL 4.5 Bus Support PCIe 3.0 OS Certificates Windows 7-101, Linux, FreeBSDx86 12

13 Bibliotecas Gráficas! Actualmente existem:! OpenGL! Direct3D que é parte do DirectX! Vulcan ( Suportada nas Nvidia 1050 > Bibliotecas Gráficas! OpenGL tem já várias versões! OpenGL 1.0 (1992)! OpenGL 2.0 (2004)! introdução do GLSL! OpenGL 3.0 (2008)! Suporte para Geometry Shader! OpenGL 4.3 (2012)! Suporte para Tesselation Shader e Compute Shader! Melhoramentos na transferência de dados entre shaders! OpenGL 4.5 (2014)! Compatibilidade com OpenGL ES 3.1! Introduz vários melhoramentos, ex: função para obter sub-regiões duma textura, etc. 13

14 Gráficos 3D na Internet! VRML: Virtual Reality Markup Language (1995)! Ficheiro de texto que permite especificar gráficos tridimensionais.! Requer a instalação de um plugin para o browser.! VRML97: Virtual Reality Modeling Language! Introduz melhoramentos (ex: interação, animação) Surgiram vários plugins, logo dificuldades na visualização de conteúdos correctamente. Gráficos 3D na Internet! Web3D (2000)! Consórcio que assumiu a responsabilidade de padronizar de novo o VRML! E passou-se a chamar: X3D (Extensible3D)! Mas o X3D acabou por não obter grandes resultados! Como os gráficos na Internet requerem:! Muito desempenho;! Muita largura de banda; Estas tentativas acabaram por nunca se impor! 14

Está disponível a partir do novo elemento canvas do HTML5! WebGL 1.0 (2011)! WebGL 2.0 - Baseada na especificação do OpenGL ES 3.0 Gráficos 3D na Internet!

15 Gráficos 3D na Internet! O3D! Uma API que estende o JavaScript com capacidades gráficas 3D, usando OpenGL e DirectX.! Criado pela Google! Mais tarde foi integrado com WebGL! WebGL (OpenGL ES 2.0 for the Web)! Uma API em JavaScript para gráficos 3D/2D para browsers compatíveis;! Está disponível a partir do novo elemento canvas do HTML5! WebGL 1.0 (2011)! WebGL Baseada na especificação do OpenGL ES 3.0 Gráficos 3D na Internet! WebGL! Existem várias bibliotecas que disponibilizam WebGL (ex: GLGE, Three.js, SpiderGL, )! Corre no browser, logo em todas as plataformas (PC, Tablet, Smartphone)! Logo muito promissor! HTML5 + WebGL 15

16 Gráficos 3D na Internet! WebGL! Exemplos! webgl_terrain_dynamic.html

Documentos relacionados

Engenharia Informática Computação Gráfica

Engenharia Informática Computação Gráfica Computação Gráfica 11569 - Engenharia Informática Gráficos 3D - Evolução Histórica Computação Gráfica 1 Sumário! Criação de Gráficos! Criação de Modelos 3D! Pipeline Gráfico! Hardware Gráfico! Bibliotecas