Articles of webgl

Diferença de renderização alfa entre o OpenGL e o WebGL

Eu estou processando a mesma cena usando o mesmo código C ++ exato, uma vez para OpenGL nativo no Windows e uma vez usando Emscripten para WebGL. Tudo na cena parece exatamente o mesmo, exceto quando estou processando algo com alpha! = 1.0. A diferença parece com isso: A cor do cubo azul é (0.0, […]

Antialiasing não está funcionando no Three.js

Eu sou novo no three.js e comecei a trabalhar muito com ele recentemente. Eu realmente gosto e criei algumas coisas incríveis. No entanto, não sei por que, mas ao definir o antialiasing como verdadeiro, não vejo diferença. renderer = new THREE.WebGLRenderer({ antialiasing: true }); Eu procurei por possíveis soluções, mas não consigo encontrar ou entender […]

WebGL Ler pixels do destino de renderização de ponto flutuante

Há alguma confusão, por exemplo, em termos de níveis de suporte para renderização em texturas de ponto flutuante no WebGL. A extensão OES_texture_float não parece exigir isso por si só, como por suporte opcional a texturas FLOAT como anexos de FBO (descontinuado) , mas parece que alguns fornecedores foram em frente e o implementaram. Portanto, […]

WebGL: Evitar que o buffer de colors seja limpo

Mesmo se eu remover gl.clearColor(c[0],c[1],c[2],1.0); gl.clear(gl.COLOR_BUFFER_BIT ); a canvas ainda é apagada no início do próximo ciclo de desenho. Há uma maneira de prevenir isto. Eu gostaria de obter algum tipo de efeito overpaint.

Desenhando muitas formas no WebGL

Eu estava lendo tutoriais daqui . var gl; function initGL() { // Get A WebGL context var canvas = document.getElementById(“canvas”); gl = getWebGLContext(canvas); if (!gl) { return; } } var positionLocation; var resolutionLocation; var colorLocation; var translationLocation; var rotationLocation; var translation = [50,50]; var rotation = [0, 1]; var angle = 0; function initShaders() { […]

Emulando charts baseados em paleta no WebGL vs Canvas 2D

Atualmente, estou usando o contexto de canvas 2D para desenhar uma imagem gerada (de pixel para pixel, mas atualizada como um buffer inteiro em uma vez após um quadro gerado) do JavaScript a uma taxa de 25fps. A imagem gerada é sempre um byte (inteiro / tipificado) por pixel e uma paleta fixa é usada […]

Three.js / WebGL – aviões transparentes escondendo outros aviões atrás deles

Quando você tem dois planos em Three.js / WebGL e um ou ambos são transparentes, às vezes o plano atrás ficará oculto pelo plano transparente acima. Por que é isso?

Comportamento de texturas transparentes no WebGL

Ambiente: WebGL, Chrome. Eu tenho o seguinte comportamento ao usar png transparentes como texturas para modelos: Imagem A – a tree esconde o prédio atrás dela e vejo a textura da checkbox do mundo. Ele também se esconde (filiais de trás não são visíveis) Ao mesmo tempo – Imagem B – funciona corretamente, a janela […]

Como você empacota um int 32bit em 4, 8bit ints no glsl / webgl?

Eu estou olhando para paralelizar algumas matemática complexa, e webgl parece ser a maneira perfeita de fazê-lo. O problema é que você só pode ler inteiros de 8 bits a partir de texturas. Eu idealmente gostaria de obter números de 32 bits fora da textura. Eu tive a idéia de usar os 4 canais de […]

Three.js / WebGL: Grandes esferas aparecem quebradas na interseção

Deixe-me começar por dizer que sou muito inexperiente com charts 3D. Problema Estou usando o Three.js. Eu tenho duas esferas que (deliberadamente) colidem no meu modelo WebGL. Quando minhas esferas são incrivelmente grandes, as esferas sobrepostas aparecem “quebradas” onde elas se cruzam, mas as esferas menores ficam perfeitamente perfeitas. Eu tenho uma razão muito específica […]