Skip to content
Advertisement

Tag: webgl

WebGL gl.triangle make square

This is some portion of the code ( the code is too long to fit ) so I will put these part where I’m curious about why it didnt draw a square but still a triangle? I know that I used gl.Triangle but I want to try using gl.Triangle to draw a square which I’m not sure which part of

Three.js webglrenderer.render issue

I’m developing a site with three.js and Nuxt.js. When i try to use the EffectComposer, the console give me a lot of warnings like this: three.webglrenderer.render(): the rendertarget argument has been removed. use .setrendertarget() instead. In my case, I understand that it’s an issue with the newest versions of three.js, because if I use an earlier version of three.js(101) it’s

How to ‘unbunch’ (co)sine waves in a 2D context?

For reference, here’s a jsfiddle I’m using to test stuff: https://jsfiddle.net/roomyrooms/7L1n02fs/57/ And here’s a gif demonstrating my issue: https://i.gyazo.com/a18e7fe19b76a93655a2cc89f166dd61.mp4 And my fragment code: Basically, I’ve discovered how to reduce the speed of time in WebGl/in trig funcs, as well as decrease their amplitude. What I’m not sure how to do, however, is ‘capture’ a specific part of the wave function

Using mat4 attribute in WebGL2

I am trying to pass a 4×4 matrix as an attribute to WebGL2 vertex shader. After following closely this SO answer, I am stuck with wrapping my head around why I can’t successfully render and get a glDrawArrays: attempt to access out of range vertices in attribute 0 error in my console. It is my understanding that mat4 is represented

WebGL render loop performance

I’ve just started learning WebGL. I am rendering multiple spheres but I’m not sure about the “bindBuffer” and “bufferData” calls inside the render loops. I can render a single sphere with 2 million vertices no problem. But once I try to render 3 spheres with 100k vertices each (300k total, 85% less vertices), the performance starts to go down. I

How do I Get Copy of Webgl Texture

I have a webgl texture and I store this texture in a javascript variable I want to keep a copy of this texture (texture1) in another variable, not instance. For example for javascript arrays, thanks to the slice function, we can keep a copy of arrays in a variable. How do I do this for webgl textures? Answer There is

Advertisement