Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

185
Visualizações
How to layer 3d objects in p5.js using WEBGL

I have 2 3D objects, a torus and a cylinder. I want the cylinder to go on top of the torus, rather than below.

function setup() {
  createCanvas(400, 400, WEBGL);
}

function draw() {
  angleMode(DEGREES)
  background(220);
  noStroke();
  rotateX(30)
  // The torus
  // The color(Torus)
  fill(241, 177, 102);
  // Drawing the Torus
  torus(100, 40);
  // The Cylinder
  // The color
  fill(138, 78, 27);
  // Drawing the cylinder
  push();
  rotateX(90);
  cylinder(130, 10);
  pop();
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.1/p5.js"></script>

In this drawing, the cylinder will appear more obvious, since it's on its side this time rather than laying flat as if it's a circle. This is simply to make it easier to see and understand what I mean.

function setup() {
  createCanvas(400, 400, WEBGL);
}

function draw() {
  angleMode(DEGREES)
  background(220);
  noStroke();
  // rotateX(30)
  // The torus
  // The color(Torus)
  fill(241, 177, 102);
  // Drawing the Torus
  torus(100, 40);
  // The Cylinder
  // The color
  fill(138, 78, 27);
  // Drawing the cylinder
  // push();
  // rotateX(90);
  cylinder(130, 10);
  // pop();
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.1/p5.js"></script>

So far, I have tried to rotate the cylinder on the Z axis, but that did not work, and I also tried drawing the cylinder before the torus, but that also did not work.

about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda