3d no Processing

All + All -

3d no Processing

+ - Renderizadores
- + - P3D
  - Gráficos 3d simplificados
  - Voltados para trabalho com pixel direto
  - size(400, 400, P3D);
- + - OpenGL
  - Gráficos em 3d via JOGL
  - Sketch > Import Library > OpenGL
  - size(400, 400, OpenGL);
+ - O eixo em 3d
+ - Transformações
- + - rotate
  - Rotaciona o eixo
  - + - Documentação
    - ~ Português
    - ~ Inglês
- + - translate
  - Desloca a janela de visualização
  - + - Documentação
    - ~ Português
    - ~ Inglês
- + - scale
  - Altera a escala da janela de visualização
  - + - Documentação
    - ~ Português
    - ~ Inglês
- + - Operações de matriz
  - pushMatrix
  - popMatrix
  - resetMatrix
  - printMatrix
  - applyMatrix
+ - Rotações em relação ao eixo
+ - Primitivas gráficas 3d
- + - box
  - ~ Documentação em inglês
    Desenha caixa 3d
    + - Sintaxe
    - box(size)
    - box(width, height, depth)
    + - Parâmetros
    - + - size
      - dimensão
    - + - width
      - Tamanho em x
    - + - height
      - Tamanho em y
    - + - depth
      - Tamanho em z
    // _01cubo
    
    void setup() {
    
      size(400, 400, P3D);
    
    }
    
    void draw() {
    
      background(0);
    
      // Move para o centro da tela
    
      translate(200, 200, 0);
    
      // Rotaciona no eixo y usando
    
      // o valor de mouseX
    
      // map serve para reescalonar o mouseX
    
      // entre -PI e +PI
    
      rotateY(map(mouseX, 0, width, -PI, PI));
    
      box(200);
    
    }
- + - sphere
  - ~ Documentação em inglês
    + - Sintaxe
    - sphere(radius)
    sphereDetail altera o detalhamento da esfera
    // 02esfera
    
    void setup() {
    
    size(400, 400, P3D);
    
    }
    
    void draw() {
    
    background(0);
    
    translate(200, 200, 0);
    
    // Rotaciona no eixo X a partir do mouse Y.
    
    rotateX(map(mouseY, 0, width, -PI, PI));
    
    sphere(100);
    
    // Determina o detalhamento da esfera a partir de mouseX
    
    sphereDetail(mouseX);
    
    }
+ - Luzes
- + - Ambiente
  - + - Função ambientLight
    - ~ Documentação em inglês
      + - Sintaxe
      - ambientLight(v1, v2, v3)
      + - Parâmetros
      - + - v1
        vermelho ou tonalidade
      - + - v2
        verde ou tonalidade
      - + - v3
        azul ou tonalidade
      // _03luz_ambiente
      
      size(100, 100, P3D);
      
      background(0);
      
      noStroke();
      
      ambientLight(50, 255, 102);
      
      translate(32, 50, 0);
      
      rotateY(PI/5);
      
      box(40);
      
      translate(60, 0, 0);
      
      sphere(30);
    Não vem de uma direção específica
    
    O objeto é iluminado igualmente em todos os lados
- + - Direcional
  - + - Função directionalLight
    - ~ Documentação em inglês
      + - Sintaxe
      - directionalLight(v1, v2, v3, nx, ny, nz)
      + - Parâmetros
      - + - v1
        vermelho ou tonalidade
      - + - v2
        verde ou tonalidade
      - + - v3
        azul ou tonalidade
      - nx
      - ny
      - nz
      // _04_luz_direcional
      
      void setup() {
      
        size(400, 400, P3D);
      
        noStroke();
      
      }
      
      void draw() {
      
        background(0);
      
        ambientLight(128, 128, 128);
      
        // 0, 255, 0 - verde
      
        // -1, 0, 0 - luz vem da direita para a esquerda
      
        directionalLight(0,255,0, -1, 0,0);
      
        translate(width/2, height/2, 0);
      
        rotateY(map(mouseX, 0, width, 0, 2*PI));
      
        rotateX(map(mouseY, 0, height, 0, 2*PI));
      
        box(100);
      
      }
    Luz que vem de uma direção
    
    Sem localização específica
    
    Luz paralela
    
    Mais forte nas áreas quadradas
    
    Mais fraco nas angulações
    
    O sol
- + - Puntual
  - + - Função pointLight
    - ~ Documentação em Inglês
      + - Sintaxe
      - pointLight(v1, v2, v3, x, y, z)
      + - Parâmetros
      - + - v1
        vermelho ou tonalidade
      - + - v2
        azul ou tonalidade
      - + - v3
        verde ou tonalidade
      - + - x
        posição da fonte de luz em x
      - + - y
        posição da fonte de luz em y
      - + - z
        posição da fonte de luz em z
      // 05luz_puntual
      
      void setup() {
      
        size(400,400,P3D);
      
        noStroke();
      
      }
      
      void draw() {
      
        background(0);
      
        ambientLight(128,128,128);
      
        pointLight(255,0,0,mouseX, mouseY, 0);
      
        directionalLight(0,255,0,-1,0,0);
      
        translate(100,height/2);
      
        sphere(70);
      
        translate(200,0);
      
        sphere(70);
      
      }
    Proveniente de um ponto
    
    Com localização específica
    
    Espalha a partir do ponto
- + - Spot Light
  - + - Função spotLight
    - ~ Documentação em Inglês
      + - Sintaxe
      - spotLight(v1, v2, v3, x, y, z, nx, ny, nz, angle, concentration)
      + - Parâmetros
      - + - v1
        vermelho ou tonalidade
      - + - v2
        verde ou tonalidade
      - + - v3
        azul ou tonalidade
      - + - x
        posição da fonte de luz em x
      - + - y
        posição da fonte de luz em y
      - + - z
        posição da fonte de luz em z
      - + - nx
        direção em relação ao eixo x
      - + - ny
        direção em relação ao eixo y
      - + - nz
        direção em relação ao eixo z
      - + - angle
        ângulo do cone de luz
      - + -
        concentration
        
        quanto a intensidade de luz é atenuada em função do ângulo
      // _06luz_spot
      
      void setup() {
      
        size(400,400,P3D);
      
        noStroke();
      
      }
      
      void draw() {
      
        background(0);
      
        ambientLight(128,128,128);
      
        // Cria uma luz spot vermelha,
      
        // partindo de um ponto dependente do mouse,
      
        // na direção 0, 0, -1
      
        // com um certo ângulo e concentração
      
        spotLight(255,0,0,mouseX, mouseY, 300, 0,0,-1, PI/12, 2);
      
        //pointLight(255,0,0,mouseX, mouseY, 300);
      
        directionalLight(0,255,0,-1,0,0);
      
        translate(width/2,height/2);
      
        sphereDetail(50);
      
        sphere(100);
      
      }
    Proveniente de um ponto
    
    Com localização específica
    
    Gera um cone de luz a partir do ponto
+ - Texturas
- Texturas estão associadas a vértices
  
  + - Determinação de figuras a partir de vértices
  - ~ Função vertex
  + -
  Vértices são consumidos em figuras de diferentes tipos
  - ~ Função beginShape
  - ~ Função endShape
  + - Declaração da textura
  - ~ Função texture
  + -
  Coordenadas de mapeamento de textura podem ser normalizadas
  - textureMode(NORMALIZED);
  - + - NORMAL_SPACE
    - 0,0
    - 0,1
    - 1,1
    - 0,1
```
// _07textura
// Usando imagem de: http://tinyurl.com/fotoeu
size(100, 100, P3D);
noStroke();
PImage a = loadImage("eu.jpg");
textureMode(NORMALIZED);
beginShape();
texture(a);
vertex(10, 20, 0, 0);
vertex(80, 5, 1, 0);
vertex(95, 90, 1, 1);
vertex(40, 95, 0, 1);
endShape();
```
  // _08textura2
  
  PImage textura;
  
  void setup () {
  
    size(300,300,P3D);
  
    textura = loadImage("eu.jpg");
  
  }
  
  void draw() {
  
    background(0);
  
    translate(width/2,height/2);
  
    rotateX(map(mouseY,0,height,0, 2*PI));
  
    rotateY(map(mouseX,0,height,0, 2*PI));
  
    textureMode(NORMALIZED);
  
    beginShape(QUADS);
  
    texture(textura);
  
    vertex(0,0,0,0,0);
  
    vertex(100,0,0,1,0);
  
    vertex(100,100,0,1,1);
  
    vertex(0,100,0,0,1);
  
    endShape();
  
    beginShape(QUADS);
  
    texture(textura);
  
    vertex(0,0,0,0,0);
  
    vertex(100,0,0,1,0);
  
    vertex(100,0,100,1,1);
  
    vertex(0,0,100,0, 1);
  
    endShape();
  
  }
+ - Carregamento de Modelo 3D
- O Processing não tem suporte nativo ao uso
- ~ Download da biblioteca .OBJ loader
- + - Descompactar dentro da pasta de bibliotecas do Processing
  - Veja em File > Preferences
  - Provavelmente: C:\Users\Usuario\Documents\Processing\libraries
- + - Obter o arquivos obj e mtl
  - ~ Exemplos
  - + - obj
    - Vértices
  - + - mtl
    - texturas
- + - No projeto, inserir a biblioteca
  - import saito.objtools.*;
    
    import saito.objloader.*;
- + - Criar uma variável para representar o modelo
  - OBJModel m;
- + - Instancie o modelo
  - m = new OBJModel(this,"lamp.obj");
- + - Dentro do draw, desenhe
  - m.drawMode(POLYGON);
    
    m.draw();
- + - Exemplo
  - // _09carregamento_modelo
    
    // Modelo lamp.obj extraido de: http://people.sc.fsu.edu/~burkardt/data/obj/obj.html
    
    import processing.opengl.*;
    
    import saito.objtools.*;
    
    import saito.objloader.*;
    
    OBJModel m;
    
    void setup() {
    
      size(300,300,OPENGL);
    
      m = new OBJModel(this,"lamp.obj");
    
      smooth();
    
    }
    
    void draw() {
    
      background(255);
    
      lights();
    
      noStroke();
    
      translate(width/2,height/2);
    
      rotateY(map(mouseX,0,width,0,2*PI));
    
      rotateX(map(mouseY,0,height,0,2*PI));
    
      scale(15);
    
      m.drawMode(POLYGON);
    
      m.draw();
    
    }
+ - Referências
- ~ 3d Examples
~ Download dos exemplos da aula