Articles of three.js

Câmera Three.js inclina para cima ou para baixo e mantém o nível do horizonte

O camera.rotate.y se move para a esquerda ou para a direita de uma maneira previsível. O camera.rotate.x olha para cima ou para baixo previsivelmente quando o camera.rotate.y está em 180 graus. mas quando eu mudo o valor de camera.rotate.y para algum novo valor, e então mudo o valor de camera.rotate.x, o horizonte gira. Eu procurei […]

Convertendo a posição 3D para a posição de canvas 2d

Eu preciso do código Three.js para converter coordenadas de object 3D para 2d em um elemento ‘div’ para que eu possa colocar labels de texto onde eles precisam estar (sem que esses labels sejam dimensionados / movidos / girados junto com o movimento 3D). Infelizmente, todos os exemplos que vi e tentei até agora parecem […]

THREE.js: 2xMeshes usando o mesmo vetor da posição

Acabei de fazer uma atualização do r67 – r69 no ThreeJS e acabo tendo problemas ao indicar suas posições para um (mesmo) vetor. Antes de fazer isso, funcionou: var vector = new THREE.Vector3(50, 50, 50); _Mesh1.position = vector; _Mesh2.position = vector; o que tornou possível que quando eu movesse uma das malhas, ela movesse a […]

Mouse / Tela X, Y para Three.js World X, Y, Z

Eu pesquisei em torno de um exemplo que corresponde ao meu caso de uso, mas não consigo encontrar um. Estou tentando converter coordenadas de mouse de canvas em coordenadas mundiais 3D, levando em conta a câmera. Soluções que eu encontrei todas interseções de raio para conseguir pegar objects. O que eu estou tentando fazer é […]

Desenhando uma linha com three.js dinamicamente

Isso é o que eu gostaria de alcançar (um polígono modificável onde os círculos vermelhos são vértices) e gostaria de construir o polígono dinamicamente. Ao iniciar a geometry como var geometry = new THREE.Geometry(); geometry.vertices.push(point); geometry.vertices.push(point); var line = new THREE.Line(geometry, new THREE.LineBasicMaterial({})); Ele funciona bem até o segundo clique, ele cria uma linha reta […]

Three.js – Largura de visão

Existe uma maneira de descobrir a largura de uma parte renderizada da cena? Por exemplo, se tivermos uma malha de largura 100, mas renderizada com um certo nível de zoom … como posso calcular a largura da parte da malha que está sendo renderizada na canvas?

Three.js – câmera ortogonal

Eu tenho trabalhado em um aplicativo que exibe alguns modelos 3D. Carregamos os modelos, criamos as malhas, adicionamos à cena … procedimento padrão. Depois que a última malha é adicionada, calculamos a checkbox delimitadora para mover a câmera e cobrir toda a cena, usando o tamanho da geometry total e o tamanho da viewport para […]

Aprendendo WebGL e three.js

Sou novo e começo a aprender sobre computação gráfica 3D em navegadores da web. Estou interessado em fazer jogos 3D em um navegador. Para quem aprendeu WebGL e three.js … O conhecimento do WebGL é necessário para usar o three.js? Quais são as vantagens de usar o three.js vs. o WebGL?

Como mudar o zOrder do object com o Threejs?

Eu fiz uma cena usando o renderizador webgl onde eu coloquei vários objects 3D que eu posso selecionar e mover. No entanto, quando um object é selecionado, gostaria de desenhar seus eixos. Não há problema em desenhar as linhas no centro do object, mas gostaria que elas aparecessem na frente de qualquer outra coisa na […]

THREE.js geram coordenada UV

Eu estou trabalhando na importação de um modelo em uma cena usando o carregador OBJ THREE.js. Eu sei que eu sou capaz de importar a geometry bem, porque quando eu atribuo um MeshNormalMaterial para ele, ele mostra grande. No entanto, se eu usar qualquer coisa que exija coordenadas UV, isso me dá o erro: [.WebGLRenderingContext]GL […]