A apresentação está carregando. Por favor, espere

A apresentação está carregando. Por favor, espere

Mini-curso: X3D Básico Bolsistas: -Gabriel M. Rossito -Bruno R. de Souza Orientador: Marcelo da Silva Hounsell.

Apresentações semelhantes


Apresentação em tema: "Mini-curso: X3D Básico Bolsistas: -Gabriel M. Rossito -Bruno R. de Souza Orientador: Marcelo da Silva Hounsell."— Transcrição da apresentação:

1 Mini-curso: X3D Básico Bolsistas: -Gabriel M. Rossito -Bruno R. de Souza Orientador: Marcelo da Silva Hounsell

2 Índice: Introdução, o que é o X3D; (interessante abordar Porque estudar X3D pros e contras do X3D) Os primeiros passos; (como instalar Padrão X3D – edit; Introdução ao código X3D; Primeiros passos; X3D-Edit; Introdução ao codigo; Perfil; Formas geometricas; Hello World; Agrupamentos; DEF e USE; Coordenadas; Viewpoint e NavigationInfo; Aparencia; Animação. 2

3 Introdução X3D significa extensible 3DX3D significa extensible 3D É considerada uma evolução natural do padrão VRML97É considerada uma evolução natural do padrão VRML97 É aberto e livre de taxasÉ aberto e livre de taxas Foi criado para fazer a comunicação entre 3D e web, sendo feito em XMLFoi criado para fazer a comunicação entre 3D e web, sendo feito em XML

4 Introdução X3D é um padrão aberto para distribuir conteúdo 3D ; O X3D não é uma API de programação,nem tão pouco um formato de arquivo para troca de geometrias; –Combina ambos, geometria e descrições de comportamentos instantâneos num simples arquivo que tem varios formatos de arquivos disponíveis para isso, incluindo o Extensible Markup Language(XML).geometriaformatos de arquivosXML O X3D surgiu de uma revisão da especificação ISO VRML97; –1994 começa o Virtual Reality Modeling Language ; –VRML 1.0 foi lançado um ano depois; –VRML 2.0 restruturou alguns nós e adicionou novas ferramentas; –1998 é fundada a WEB3D consortium, que visa o uso da tecnologia 3D em navegadores, permitindo que sites que usem JavaScript possam ter efeitos em três dimensões direto do navegador; –(e incorpora os avanços dos recursos disponíveis nos últimos dispositivos gráficos comerciais e também incorpora melhorias na sua arquitetura) 4

5 Introdução São poucas pessoas atualmente q são capazes de criar um modelo 3D; X3D subdividiu em perfis as funcionalidades de um código; Da suporte para maioria das ferramentas comuns; Fornece a importação/exportação de publicação para outro formados; Projetado para comunicação X3D com a Arquitetura da World Wide Web. Não é necessário grandes softwares para criar um X3D. É possível apenas com um editor de texto. Não possui Royalty. 5

6 Primeiros passos... Possui diversos plugins, ferramentas e recursos de fácil e livre acesso na internet. –http://www.web3d.org/x3d/content/help.htmlhttp://www.web3d.org/x3d/content/help.html –https://savage.nps.edu/X3D-Edit/https://savage.nps.edu/X3D-Edit/ – Mas o primeiro passo é a instalação do X3D plugin para seu navegador. Depois indica-se a instalaçao de um editor de código. X3D – edit. –Free; – É suportado pelo Windows, Mac, Linux, Solaris e outros; –Atualização automática; –Possui um modo compatível com o Netbeans. 6

7 Introdução X3D significa extensible 3DX3D significa extensible 3D É considerada uma evolução natural do padrão VRML97É considerada uma evolução natural do padrão VRML97 É aberto e livre de taxasÉ aberto e livre de taxas Foi criado para fazer a comunicação entre 3D e web, sendo feito em XMLFoi criado para fazer a comunicação entre 3D e web, sendo feito em XML

8 Primeiros passos para o desenvolvimento Plugin: Plugin: – BS_Contact_VRML_61 (Para Internet Explorer) Browser:Browser: –XJ3D - Java based X3D Toolkit and X3D Browser (www.web3d.org) Editor:Editor: –X3D Edit (www.web3d.org)

9 X3D Edit X3D Edit possui o drag-and-drop; Popup com recursos auxiliares; Vizualização direta; Instalação: –Baixe e extraia o X3D-Edit3.2.zip https://savage.nps.edu/X3D-Edit/X3D-Edit3.2.zip –Rode runX3DEditWind.bat para Windows; –Ou runX3DEditMac.sh.command para Mac; –Funciona em Linux; –E agora só programar! 9

10 Introdução ao código Um arquivo X3D começa com um cabeçalho que o identifica o arquivo. Independente da codificação, o cabeçalho contém os seguintes elementos na ordem: –Identificação do padrão suportado (neste caso X3D); –Versão do padrão suportado (a mais atual é a 3.2); –Identificação da codificação de caracteres suportado (utf8 – case sensitive). – Logo em seguida é necessário declarar qual perfil (profile) está sendo utilizado. Essa declaração é feita logo em seguida do cabeçalho com a seguinte sintaxe: – 10

11 Primeiros passos para o desenvolvimento Código básico (salvar como.x3d):Código básico (salvar como.x3d):

12 Profile Esses perfis identificam quais funcionalidades (componentes) o navegador X3D precisaria suportar para exibir o conteúdo do arquivo X3D. A figura abaixo mostra o nível de suporte dos perfis, sendo que um perfil suporta todas as funcionalidades do perfil englobado por ele. 12

13 Coordenadas Y é sempre para cima; X, Y, Z correspondem tbm a Norte, cima, leste; Regra da mão direita. 13

14 Regra da mão Direita 14 Para as coordenadas: Para as rotações dos eixos:

15 Primeiros passos para o desenvolvimento É o identificador de que será usado o XML versão 1.0É o identificador de que será usado o XML versão 1.0 Define de onde até a onde vai a parte de X3DDefine de onde até a onde vai a parte de X3D Área onde fica o código desenvolvidoÁrea onde fica o código desenvolvido

16 Primeiros passos para o desenvolvimento

17 Estruturas básicas Tipos de estruturas:Tipos de estruturas:

18 Forma Geometricas –Raio; –Solido. –Tamanho x,y,z; –Solida. –Altura e o raio da base; –Lado, base e se é solido; –Tamanho e raio; –Topo, lado, base e se é solido; –Largura, max da largura; –String. 18

19 Estruturas básicas Sphere: radius (um valor), solid (booleano) Box: size (três valores: x y z), solid (booleano) Cone: bottom, side, solid (booleano), bottomRadius (um valor), height (um valor) Cylinder: bottom, side, solid, top (booleano), radius (um valor), height (um valor) Text: solid (booleano), length, maxExtent (maximo de um valor por linha), string (onde vai o texto, cada conjunto de aspas é uma linha) FontStyle: Configuração da fonte (como o word)

20 Exemplo:

21 EXERCÍCIOS Fazer as formas geométricas; 21

22 Agrupamentos Os grupos de nós são organizados com as seguintes comandas: Group, StaticGroup: Transform; LOD (level of detail); Switch. 22

23 Grupos Transform: –rotation (quatro valores) –translation (três valores) –scale (três valores) –bboxCenter(três valores) –bboxSize (três valores)

24 Grupos - quando dois objetos se colidem ele deixa o de maior prioridade - grupo não é animado - serve para escolha de nodos (explicado mais tarde)

25 DEF e USE DEF serve para definir qualquer nó; –Deve começar com uma letra; –Importante usar nome completo e simples; –Ajuda na organização do código; –Procure escrever a funcionalidade; –Tente ser simples, mas completo; USE serve usar nó definido. –Case sesitive. Uso de DEF e USE deixa o código mais rápido, com um simples load e mais enxuto. 25

26 26

27 27 Exemplo:

28 Aparencia Material: –diffuseColor: Reflete as fontes luzes do ambiente, depende do ângulo de visão e do ângulo da fonte. –ambientIntensity: O quão forte será o reflexo. –emissiveColor: Incandecensia do objeto, é independente da luz. –specularColor: Conduz o reflexo do objeto. –Shininess: Controla a intensidade especular (polido). –Transparency: Permite ver através do objeto, 0 até1. Teste

29 Faça os eixos X,Y e Z. Exercício 29

30 ImageTexture Suporta os formatos.jpg e.png; Recomenda-se o uso de.gif, mas não é preciso; Outros formatos tbm podem ser suportados, mas não é garantido o funcionamento. Cuidado com o diffuseColor, pode influenciar na imagem; 30

31 PixelTexture Numero de pixels na horizontal da imagem; Numero de pixels na vertical da imagem; Valor do componente em cada pixel (0-4) Numero dos pixels: –0 sem imagem, –1 branco e preto –2 branco e preto, transparencia –3 cores r-g-b –4 cores r-g-b, transparencia 31

32 32

33 TextureTransform É o transform da imagem, trabalhando em 2D; –Translação: cima, baixo, esquerda, direita; –Rotação: ângulo no centro; –Escala (s,t); Aplicado no sistema de coordenadas, não no arquivo de imagem; Scale=3 0.5 deve mostrar 1/3 da imagem ao longo do eixo s e dobrado no eixo t. 33

34 Ferramenta de edição Editor de materiais Pellucid –Eric Haines, copyright (c) 1997 –http://tog.acm.org/resources/applets/vrml/pell ucid.html 34

35 Desafio Realize um conjunto de mesa com cadeiras apenas com um cubo. –Dica: DEF, USE, transform e procure usar Inline tbm. 35

36 Visão e navegação Como ver e navegar em um mundo 3D. –Viewpoint, NavigationInfo; Viewpoint: –Ferramenta primaria para uma navegação; –Guiar usuários; –Ajuda localizar facilmente algum objeto predeterminado. NavigationInfo: –Modo do usuario navegar pela cena; –Usando pontos ou hotkeys. 36

37 Viewpoints Viewpoints define uma especifica posição e orientação ao olhar um cena 3D. –É possivel realizar viewpoints animados, uma forma de navegação em modo video; –Mas uma liberdade de modos de visão é o mais aconselhavel; Na criação de um viewpoint: –Procure ser curto, mas completo em sua descrição. Para facilitar o entendimento de algum navegador que tente apreciar seu codigo. 37

38 Viewpoint centerOfRotation: –Rotação; –É o modo EXAMINE. position: –Posição em metros da posição inicial do sistema. Para uma orientação mais complexa recomenda-se usar transform. 38 *

39 Exercício Faça um conjunto de viewpoints para a demonstração do conjunto da mesa.

40 NavigationInfo Usado normalmente para fixar uma navegação para o usuário. –EXAMINE rotacionar; –FLY zoom; –WALK navegar em relação ao chão; –LOOKAT pontos selecionados de um objeto; –ANY deixa o usuário selecionar qualquer modo; –NONE impossibilidade de navegação; Default EXAMINE ANY 40

41 NavigationInfo speed velocidade de navegação: –Default é 1 m/s, o que é bastante devagar. headlight é a luz que sai do ponto de visto do viewpoint. –Se desativada, é preciso de adicionar luzes separadas. visibilityLimit é o limite de visibilidade do usuario. –Medido do viewpoint; –Fora do limite o objeto não é desenhado; –visibilityLimit=0.0 significa sem limites. 41

42

43 Billboard Bilboard –Feito para auxiliar a visualização ou a leitura de algum objeto na cena; –axisOfRotation: Atributo de Billboard no qual deve implicar em qual eixo aplicar; Default é axisOfRotation=0 1 0 que gira envolta do eixo y; Definir axisOfRotation=0 0 0 implica que o objeto estará sempre voltado para o usuario; Nunca coloque um viewpoint dentro de um billboard!!! 43

44 Billboard codigo 44

45 Exercício Faça um tabuleiro de xadrez. –Procure mudar o viewpoint inicial e definir alguma navegação. –Adicone as letras e n° respectivos(ex.: 7,B); Use Billboard B

46 Animação Route: –Conecta a saída informação de um nó para passar um valor e estimular a entrada dessa informação para outro nó. A passagem de valor inclui uma marcação de tempo. Modificaçao das cenas: –Behavior, mudança de um valor de um nó. –Event, tempo marcado passando por uma rota. Cascada de eventos, serie de eventos, onde um evento desencadeie outro. Não é possível um evento infinito, todo evento deve ser completo. Toda animaçao 3D é considerada uma modificação gráfica em um devido tempo. Um exemplo de comportamento em uma rota: 46

47 Animação e interpolação = controla quando a animação flui –cycleInterval, startTime, stopTime, pauseTime, resumeTime (um valor), loop, enabled (booleano) = determina de onde até onde deve ser feito –fromNode, fromField, toNode, toField (nomes)

48 Animação e interpolação

49 10 passos básicos para uma animação 1° Escolha o nó a ser animado; 2° Defina um nome para o nó de interesse; 3° Certifique-se se o nó é input e determine seu ponto flutuante: SFFloat, SFVec3f, SFColor e etc; –http://www.web3d.org/x3d/specifications/ISO-IEC X3D- AbstractSpecification/Part01/fieldsDef.htmlhttp://www.web3d.org/x3d/specifications/ISO-IEC X3D- AbstractSpecification/Part01/fieldsDef.html –http://www.web3d.org/x3d/specifications/ISO-IEC X3D- AbstractSpecification/Part01/shaders_glsl.htmlhttp://www.web3d.org/x3d/specifications/ISO-IEC X3D- AbstractSpecification/Part01/shaders_glsl.html 4° Se o nó objetivo é SFBool ou SFInt32, use um nó sequencial; Se o nó objetivo for SFNode ou MFNode, use um no Script; 49

50 5° Determinar qual Interpolator: se você não estiver usando um nó sequencer ou Script, determine qual interpolador irá produzir a informação correta para uma mudança de valor(value_changed) de saida, por exemplo: PositionInterpolator produz SFVec3f value_changed events. 6° Triggering sensor: se desejar adicione um sensor no inicio, para produzir SFTime ou SFBool trigger para começar a animação. –Normalmente um evento triggering é um informação de saida para uma cascata de animação. 50

51 7° TimeSensor clock: adicione um sensor de tempo, então ajuste seu campo cycleInterval de acordo com o intervalo de duração de seu animação. –Ajuste loop=false se a animação percorre até um tempo pré estimado; –Loop=true se é repetitivo. 8°Connect Trigger: sensor ROUTE para o TimeSensor enviar uma ordem de iniciar a animação. 51

52 9° Connect clock: faça um ROUTE o TimeSensor fraction_changed para o interpolador(ou sequencia) set_fraction na ordem para seguir a animação de modo correto; 10° Connect animation output: ROUTE a interpolação, sequencia, ou Script no campo value_changed para o objetivo de interesse na ordem para se completar a animação. 52

53 53 Exemplo

54 54 Exemplo

55 Muito obrigado a todos!!!! Referencias: –X3D: Extensible 3D Graphics for Web Authors, Don Brutzman –http://www.web3d.org/x3d/content/examples/help.htmlhttp://www.web3d.org/x3d/content/examples/help.html –http://x3dGraphics.comhttp://x3dGraphics.com –http://www.xj3d.org/http://www.xj3d.org/ –http://www.web3d.org/http://www.web3d.org/ Plugin: – BS_Contact_VRML_61 (Para Internet Explorer) Browser: –XJ3D - Java based X3D Toolkit and X3D Browser (www.web3d.org) Editor: –X3D Edit (www.web3d.org)www.web3d.org Contato: 55


Carregar ppt "Mini-curso: X3D Básico Bolsistas: -Gabriel M. Rossito -Bruno R. de Souza Orientador: Marcelo da Silva Hounsell."

Apresentações semelhantes


Anúncios Google