VRML Logo

Tutorial VRML 1.0
Por Juliano Ipolito
Todos os direitos reservados.

Barra Separadora

 Índice

 Características básicas

  • Começando com a linguagem
  • Unidades de Medida
  • Nodes

    •  Nodes Básicos - Criando objetos

     Nodes de Transformação - Mudando as características dos objetos


     Recursos on-line



     Introdução ao VRML

    Há um tempo atrás, surgiu a idéia de levar a Realidade Virtual para a Internet. Dessa idéia surgiu o VRML, que é a abreviação de Virtual Reality Modeling Language, ou Linguagem para Modelagem em Realidade Virtual. VRML é uma linguagem independente de plataforma que permite a criação de ambientes virtuais por onde se pode passear, visualizar objetos por ângulos diferentes e até interagir com eles. A primeira versão da linguagem não possibilita muita iteração do usuário com o mundo virtual, mas versões recentes acrescentam características como animação, movimentos de corpos e interação entre usuários. A última versão é a 2.0, chamada Moving Worlds VRML 2.0. A Especificação VRML é a documentação que descreve todas as características da linguagem.

    Apresentada pela primeira vez em 1994 na Primeira Conferência sobre World Wide Web, a linguagem tem como objetivo dar o suporte necessário para o desenvolvimento de mundos virtuais multi-usuários na Internet, sem precisar de redes de alta velocidade. O código VRML é um subconjunto do formato de arquivo ASCII do Open Inventor, da Silicon Graphics, com características adicionais para navegação na Web. Esta característica é equivalente às âncoras do HTML, ou seja, pode-se criar âncoras em um mundo virtual que levem a outros mundos virtuais.

    A linguagem trabalha com geometria 3D (VRML 1.0 possui algumas primitivas : cubo, cone, cilindro e esfera) e suporta transformações (rotação, translação, escala), texturas, luz e sombreamento. Outra característica importante da linguagem é o Nível de Detalhe (LOD, level of detail) que disponibiliza a quantidade certa de dados para um objeto baseado na sua importância na cena. Isso torna rápida a visualização e possibilita ao usuário ajustar o nível de detalhe que lhe for melhor.

    Para navegar em mundos virtuais criados com a linguagem você precisará usar browsers que suportem VRML. Assim, ao invés de visitar homepages, você visitará homeworlds. Existem muitos browsers disponíveis que suportam diretamente a linguagem. Outros browsers que não suportam necessitam de software adicional (plug-in).

    [Índice]



     Características Básicas

    Tudo que se precisa para escrever um código VRML é um editor de textos. Uma vez editados, os arquivos são gravados em formato ASCII com a extensão .wrl. Na verdade, a linguagem apenas descreve como os ambientes tridimensionais serão representados pelo browser. O arquivo não precisa ser compilado e não é executado por ninguém. Pode-se, por exemplo, criar um cubo e gravá-lo em um arquivo chamado cubo.wrl. O código VRML para este cubo descreverá as características do ambiente, como coordenadas, luz, cores, sombreamento etc. Também pode-se colocar em um mundo objetos que estão localizados remotamente em outros lugares na internet, além de links que levam a outros homeworlds ou homepages.

    Ficou definido, para fins de identificação, que todo arquivo VRML 1.0 tem que ter o cabeçalho :

    #VRML V1.0 ascii

    Futuramente, em outras versões da linguagem, isto muda. Na versão atual, o cabeçalho fica da seguinte maneira :

    #VRML V2.0 utf8

    O caracter '#' também significa comentário. Toda linha que começa com # será ignorada pelo browser. É bom usar comentários no meio do código, isso facilita a compreensão e identificação de partes do cenário, como por exemplo :

    # Universidade Federal de São Carlos - Departamento de Computação
             .
             .
             .



     Nodes


    O node AsciiText é usado para colocar texto no cenário. Por definição, o texto é colocado pela primeira vez na posição (0,0,0). Outros parâmetros como tipo e estilo da fonte podem ser mudados usando o node FontStyle. Os parâmetros para AsciiText são os seguintes :

  • FontStyle - Mudando a aparência do texto
    • FontStyle {
        size            10              # número real
        family          SANS            # SANS ou SERIF ou TYPEWRITER
        style           BOLD            # BOLD ou ITALIC ou NONE
}

    Ver um exemplo de FontStyle

    [Índice]

  • Cube - Definindo Cubos

    • O node Cube é usado para definir paralelepípedos. Para isso, entramos com sua largura (width), sua altura (height) e sua profundidade (depth). A posição do cubo no espaço será definida pela posição do seu centro. Então quando falarmos em posição de um cubo, estaremos falando da posição do seu centro. Esta regra vale para muitos outros objetos. 

    Exemplo 1 :
    #VRML V1.0 ascii
Cube {
   width 30
   height 30
   depth 60
}
Ver exemplo 1
    Exemplo 2 :
    VRML V1.0 ascii
Cube { width 30 height 30 depth 60 }
Translation { translation -70 0 0 }
Cube { width 45 height 45 depth 45 }
Ver exemplo 2

    Veja os exemplos acima. O exemplo 1 demonstra um cubo. O exemplo 2 mostra como podemos criar um outro cubo deslocado para a posição (-70, 0, 0) do espaço, usando o node de transformação Translation. Este node é usado para posicionar objetos no espaço. Se colocássemos no arquivo texto outro objeto logo abaixo da definição do cubo, este teria seu centro na mesma posição que o centro do cubo, porque o novo objeto estaria no mesmo contexto ou hierarquia que o cubo. Quem define a hierarquia dos objetos no ambiente é o node Separator. Se tivéssemos definido cores, luz, rotação etc., estas características só estariam presente nos objetos contidos nesse contexto.

    [Índice]

  • Cone - Definindo Cones

    • O node Cone é usado para criar cones simples. Os parâmetros para este node são : bottomRadius, que define o raio da base, e height, que define sua altura. Por default, o cone é centralizado na posição (0,0,0), tem raio 1 e altura 2. Exemplo de um cone de altura 3 e raio 1 : 

    #VRML V1.0 ascii
Cone {
    bottomRadius    1
    height          3
}
Ver este exemplo

    Vamos agora acrescentar mais um objeto ao exemplo acima. Vamos colocar mais um cone em outra posição no cenário. Para isso temos de usar o node Translation para definir a posição deste novo objeto. O novo exemplo é o seguinte : 

    #VRML V1.0 ascii
Cone {
       bottomRadius 10
       height       15
}
Translation {
       translation 70 0 0
}
Cone {
       bottomRadius 10
       height       30
}
Ver este exemplo

    No exemplo acima são criados dois cones : um de altura 15 e outro de altura 30. Devido ao node Translation o cone de altura 30 é colocado na posição (70,0,0). Se outro objeto for acrescentado ao exemplo, este terá seu centro nesta mesma posição.


    [Índice]

  • Sphere - Definindo Esferas

    • O node Sphere é usado para representar uma esfera. Por default, o raio da esfera é 1 unidade e seu centro está em (0,0,0). O único parâmetro para Sphere é radius, que define o comprimento do seu raio. Exemplo de uma esfera de raio 10 : 

    #VRML V1.0 ascii
Sphere {
    radius 10
}
Ver este exemplo

    Vamos agora acrescentar outro objeto ao exemplo acima :

    #VRML V1.0 ascii
Sphere { radius 10 }
Translation {
    translation 0 -15 0
}
Rotation {
    rotation 1 0 0 3.1415
}
Cone {
    bottomRadius  8
    height       25
}
Ver este exemplo

    No exemplo acima uma esfera de raio 10 é criada. Em seguida, um cone é criado. O cone de altura 25 e raio 8 sofre duas transformações : uma rotação e uma translação. Primeiro, a translação desloca o cone um pouco para baixo em relação ao eixo-y. Depois, o node Rotation rotaciona o cone para que sua base fique para cima. Os parâmetros para o node Rotation indicam que os objetos subseqüentes sofrerão rotação no eixo-x (1,0,0) de 3.1415 radianos (ou 180 graus). Após estes procedimentos teremos um objeto parecido com um sorvete.

    [Índice]

  • Cylinder - Definindo Cilindros

    • O node Cylinder é usado para definir cilindros. Por default, o cilindro está na vertical, com seu centro na posição (0,0,0) e com raio igual a 1 unidade. Existem dois parâmetros para Cylinder : radius, que define seu raio, e height, que define sua altura. Exemplo :

    #VRML V1.0 ascii
Cylinder {
        radius  10
        height  30
}
Ver este exemplo

    A seguir, um outro exemplo mostrando como modelar um simples pinheiro :

    #VRML V1.0 ascii
Cone { 
    height        30
    bottomRadius  10
} 
Translation { 
    translation   0 -22.5 0 
} 
Cylinder { 
    radius  3  
    height 15 
}
Ver este exemplo

    No exemplo acima criamos um cone e um cilindro. Como o cone tem altura 30, a coordenada y do seu centro será 15. Deslocando 22.5 pontos em relação ao eixo-y no sentido negativo, teremos a posição y = -7.5 (15 - 22.5 = -7.5). Para que o cilindro alcance o cone ele precisa ter altura 15, pois assim seu centro estará em y = -7.5. Assim conseguimos fazer com que os dois objetos fiquem adjacentes. Para visualizar com mais detalhes, clique com o botão direito, selecione a opção Detail, e então selecione Wireframe.

    [Índice]

  • Material - Dando cores aos objetos

    • O node Material define características dos objetos como cor e brilho. Os parâmetros que são usados determinam a forma como a luz irá refletir sobre os objetos. São eles :

    A cor dos objetos é formada pela composição das cores básicas  vermelho, verde e azul (RGB), cujos valores variam entre 0 e 1. Sendo assim, se quisermos um objeto amarelo temos que especificar (1,1,0), ou seja, 100% de vermelho e verde e nada de azul. Vamos acrescentar cor a alguns objetos do exemplo do pinheiro : 

    #VRML V1.0 ascii 
Material { 
     diffuseColor 0 1 0 
     shininess 0 
} 
Cone {height       30
      bottomRadius 10 
} 
Material { 
     diffuseColor 64 0 0 
     shininess    1
}
Translation { 
     translation 0 -22.5 0 
} 
Cylinder {radius 3 
          height 15 
}
Ver este exemplo

    [Índice]

  • IndexedFaceSet, IndexedLineSet, Coordinate3 - Trabalhando com polígonos

    • Este conjunto de nodes é muito importante pois é com eles que definimos formas geométricas que não estão pré-definidas na linguagem. O node Coordinate3 é usado para definir pontos no ambiente, onde cada ponto tem seu respectivo índice, iniciando em zero. Por exemplo : 

    #VRML V1.0 ascii 
Coordinate3 { 
     point [ 0  0  0,  #ponto 0
            10  0  0,  #ponto 1
             5 10  0,  #ponto 2
     ]
}

    Isto define 3 pontos : o ponto 0, cujas coordenadas são (0,0,0), o ponto 1 (10,0,0) e o ponto 2 (5,10,0). Coordinate3 apenas especifica as coordenadas dos pontos no espaço. Isso significa que, por enquanto, não temos nenhuma figura no ambiente. Agora queremos ligar os 3 pontos no espaço para formar um triângulo. Para isso usamos o node IndexedFaceSet.

    #VRML V1.0 ascii
Coordinate3 {
        point [
                  0   0   0,
                 10   0   0,
                  5  10   0,
        ]
}
IndexedFaceSet {
        coordIndex [
                  0,  1,  2,  -1
        ]
}
Ver este exemplo


    Definidos os pontos, basta ligá-los para formarmos um triângulo. No exemplo, IndexedFaceSet definiu quais pontos seriam ligados para formar esta face. O -1 indica o fim da ligação. Se ao invés de um triângulo preenchido quiséssemos só um contorno, usaríamos o node IndexedLineSet. Ele funciona da mesma maneira que IndexedFaceSet, mas ao invés de preencher a face que está sendo definida ele apenas desenha seu contorno. Exemplo usando IndexedLineSet :

    #VRML V1.0 ascii
Material {
        diffuseColor 1 1 0
}
Coordinate3 {
        point [
                 0   0   0,
                10   0   0,
                 5  10   0,
        ]
}
IndexedLineSet {
        coordIndex [
                 0,  1,  2, 0, -1
        ]
}
Ver este exemplo

    O exemplo a seguir mostra como criar uma pirâmide sólida e outra com apenas o contorno :

    #VRML V1.0 ascii
Separator {
        DEF CoordPiram Coordinate3 {
                point [
                         0     0     0,   #0
                        30     0     0,   #1
                        30    30     0,   #2
                         0    30     0,   #3
                        15    15    20,   #4
                ]
        }
        Separator {
                USE CoordPiram
                IndexedFaceSet {
                        coordIndex [
                                0, 1, 2, 3,  -1, 
                                0, 1, 4,     -1,
                                1, 2, 4,     -1,
                                2, 3, 4,     -1,
                                3, 0, 4,     -1,
                        ]
                }
        }
        Separator {
                Translation {
                        translation 75 0 0
                        }
                USE CoordPiram
                IndexedLineSet {
                        coordIndex [
                                0, 1, 2, 3, -1,
                                0, 1, 4,    -1,
                                1, 2, 4,    -1,
                                2, 3, 4,    -1,
                                3, 0, 4,    -1,
                        ]
                }
        }
}
    Ver este exemplo

    [Índice]

  • Rotation - Rotacionando objetos

    • O node Rotation é usado para rotacionar objetos no espaço. Como exemplo, vamos rever o node Cylinder. Por default, todo cilindro é criado na posição vertical. Se quisermos um cilindro na horizontal, basta utilizarmos o node Rotation :

    #VRML V1.0 ascii
Rotation {
        rotation 0 0 1 1.57
}
Cylinder {}
    Ver este exemplo

    No exemplo acima, o cone é rotacionado 90 graus (1.57 radianos) sobre o eixo-z ( 0 0 1 ).

    [Índice]

  • Translation - Deslocando objetos

    • Este node é parecido com o Rotation, mas é usado para deslocar objetos. Veja o exemplo abaixo :

    #VRML V1.0 ascii
Cube {}
Translation { 
        translation 10 0 0
}
Sphere {}
Translation {
        translation -20 0 0
}
Cone {}
Ver este exemplo

    No exemplo acima, criamos um cone na origem (0,0,0), pois este é o primeiro objeto que está sendo criado e antes dele não foi aplicado nenhum deslocamento ou rotação. Logo após a criação do cubo, usamos o Translation para deslocarmos os objetos subseqüentes para a posição (10,0,0). Isto significa que todo objeto que for criado a partir daí terá seu centro nesta posição. Sendo assim, a esfera que é criada em seguida terá seu centro na posição (10,0,0). Depois aplicamos mais uma vez o Translation. Repare no valor do deslocamento : -20 em relação ao eixo-x. Isto faz com que o cone que é criado em seguida esteja localizado a -20 unidades de distância da esfera em relação ao eixo-x, e a -10 unidades de distância do cubo. A seguir é mostrado um outro modo de se fazer isso :

    [Índice]

  • Separator - Definindo a hierarquia dos objetos

    • Este node define a hierarquia dos objetos dentro do cenário. É usado para separar um grupo de objetos do resto do ambiente, ou seja, as características desse grupo serão diferentes do resto. Veja o exemplo :

    #VRML V1.0 ascii
Material { diffuseColor 1 1 0 }
Separator {
        Material { 
                diffuseColor 0 1 0 
        }
        Cube {}
        Translation { 
                translation 10 0 0
        }
        Sphere {}
}
Translation {
        translation -10 0 0
}
Cone {}
    Ver este exemplo

    Quando definimos a cor amarela pela primeira vez (diffuseColor 1 1 0), esperamos que todos os objetos subseqüentes sejam desta cor. No entanto, apenas o cone é amarelo. Isto se deve ao uso do node Separator, que separa o cubo e a esfera do resto do ambiente. As propriedades definidas para estes objetos (posição e cor) não irão interfirir nos outros objetos que estiverem fora deste contexto ou hierarquia. Repare no translation -10 0 0; não foi necessário deslocar -20 unidades porque este é o primeiro deslocamento feito no contexto em que está o cone. Também a cor verde só vale dentro do contexto do cubo e da esfera.

    [Índice]

  • Texture2 - Trabalhando com texturas

    • Este node é usado para aplicar texturas aos objetos.

    #VRML V1.0 ascii
Texture2 {
        filename "granite.gif"
}
Sphere {}
    Ver este exemplo

    [Índice]

  • LOD - Definindo o nível de detalhe
  • Recursos on-line

    • Copyruight (C) 1996 Juliano Ipolito.
    Todos os direitos reservados.