Questions tagged [webgl]
WebGL extends the capability of the HTML canvas element to allow it to render accelerated 3D graphics in any compatible web browser.
93 questions
1
vote
1
answer
58
views
Fumbling with the "render of a triangle whose aspect ratio doesn't change with client window size" issue
WebGL uses a coordinate system that spans -1, -1 to 1, 1 in the upper-right corner of the display.
This is of significance, ...
- 99
1
vote
1
answer
60
views
Vertices are being squished by the viewport! scaling is all messed up, and i'd like to learn a lot more about why (gif)
My canvas is being set with
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;. this makes sense to me, ...
- 99
1
vote
1
answer
78
views
beginner WebGL program is drawing triangle in unexpected location
i've been following a gentlemen's WebGL tutorial to a T, and my code is literally identical to his (i think), but the triangle is being drawn in a completely different location. The vertices are [-0.5,...
- 99
1
vote
1
answer
68
views
Why does WebGL expect "clip-space coordinates" for VBO / model data, isn't that supposed to be the output of a vertex shader (after using m-spaceVBO)?
i built a tiny software-based rasterizer in pure js at first, and the tutorials i reviewed always suggested that "clip-space" was the product of the MVP transformation.. not the expected ...
- 99
0
votes
0
answers
95
views
How to triangulate non simple (self intersecting) polygon?
[Beginner to Computer Graphics and WebGL]
I am adding lines to allow the user to draw any shape. If polygon is simple, everything is working as expected, but if polygon is non-simple or self-...
- 101
1
vote
0
answers
44
views
WebGL depth testing, gl.EQUAL expected behaviour
I'm getting inconsistent behaviour in WebGL's gl.EQUAL depth function when testing against "cleared" values in the depth buffer on some hardware. After ...
- 111
0
votes
0
answers
32
views
Sprite animation with pixelStorei & texImage2D gives strange color margin
This code works generally. I use 4x4 shema for sprite animation (texture/image). Only when YY is 3 (last row) i got strange color margin.
I found at How do I use texSubImage2D to show sprites in webgl?...
- 101
0
votes
0
answers
64
views
webGL Shadows implementation (FrameBuffer)
I wanna implement shadows example from webgl2fundamentals
also i a aware of framebuffer principe a have already working implementation of mirror projection.
Ignore VS extra vars .
I have trouble with ...
- 101
1
vote
0
answers
84
views
How can I accumulate past 256 in a framebuffer texture?
As a way to estimate screenspace density of a set of particles, I'm trying to do some splatting: render a circle of fixed radius around each particle, accumulating, to get a count of how many ...
- 111
1
vote
0
answers
195
views
Projecting a texture onto UVs with GLSL
I am trying to project an image overlayed on top of a mesh in screen space back to it's uvs. The UV triangles do not always cover entire pixels so i get this. The red is showing where the texture is ...
1
vote
1
answer
511
views
Convert between screen and world coordinates in isometric 3D
I'm working on a a simple 3D scene in WebGL. The purpose is to:
Implement an isometric viewing angle in orthographic 3D
Translate between XY screen coordinates and XY world coordinates
Codepen: ...
- 127
0
votes
1
answer
284
views
How to correctly handle rendering of ~600000, arbitrary colored 2D squares with WebGL?
Information
I have to render a map, that is rendered as a 2d collection of squares of different color, separated by white lines horizontally and vertically. There may be ~600000 squares surrounded by ...
- 101
0
votes
1
answer
156
views
Position a 3D camera directly above or below the target
I'm trying to setup a 3D camera in WebGL. The camera is setup with the help of a lookAt function. The lookAt function takes cameraTarget, ...
- 127
1
vote
1
answer
623
views
Move the camera in orthographic 3D
I'm trying to figure out how to move a camera in orthographic 3D. The scene is orthographic in the sense that an object looks the same regardless of position. The only thing that may affect the size ...
- 127
0
votes
0
answers
127
views
How to setup a 3D camera
I'm trying to figure out how to setup a 3D camera in WebGL. This is my first swing at 3D so a lot of the matrix stuff is new to me.
Code
The code can be reviewed in this CodePen: https://codepen.io/...
- 127