7
votes
Fading particles and transition
I made a visualization a little like yours years ago, and used a similar technique, because it's the natural approach to the problem. After I spent a few years writing drivers for modern GPUs, I ...
7
votes
Can a scene graph be stored in the GPU?
Short answer: Yes, It can be done. But no one does so.
Long answer:
Scene graphs can be stored and processed on a GPU using OpenCL/WebCL. But it is not practical to do so. Updating scene graphs (a ...
6
votes
What actually happens in frame buffer when an image or document is scrolled?
In the olden days of text-mode terminals, the "frame buffer" was a buffer of text, not an image. Scrolling worked in the way you described. The buffer was larger than would fit on the screen, and to "...
6
votes
Is it possible to create minimal glTF files with vertex and index buffers?
While creating a set of glTF models for a tutorial, I also intended to create THE minimal glTF file.
Update: The following referred to glTF 1.0/1.1. See below for an update of this example to glTF 2....
5
votes
Accepted
Can we use PhysX in WebGL?
PhysX is a C++ API and can thus not directly be integrated with the JavaScript-based WebGL.
Depending on your needs, you have the following options:
Use a JavaScript-based physics engine, mostly ...
4
votes
WebGL: Why are my textures black?
Okay, I figured it out. It has to do with the texture not loading before the first display function is called. The texture displays after a mouse or keyboard event. To remedy this, I added a timer to ...
4
votes
Accepted
Rendering same vertex-array in different modes
Your shaders are fine, the problem is topological, that is the way the vertices are connected to create triangles.
For cases 1 & 2: You cannot really draw a grid of points in this mode (...
4
votes
Accepted
Optimizing performance on hardware
Although you may be able to detect what hardware is available as a first approximation of a computer's capability, depending on this might not be useful since the same hardware may behave differently ...
4
votes
Accepted
Inverse matrix order of operation
Yes. If you're compounding operations to make a matrix, then the inverse matrix will be the compound of the inverse operations, in the reverse order. So if $C = AB$ then $C^{-1} = B^{-1}A^{-1}$
Think ...
4
votes
Accepted
Triangulation of vertices of an ellipsoid
If you sample the two parameters $\eta$ and $\omega$ with steps $d\eta$ and $d\omega$, then you'll get a grid of points $v_{ij} = f(i\;d\eta,j\;d\omega)$. Any four adjacent points will define a ...
4
votes
Accepted
Does WebGL 2 support linear depth texture sampling?
The spec says depth textures are not filterable.
3.8.13
...
Using the preceding definitions, a texture is complete unless any of the following conditions hold true:
The effective ...
3
votes
Accepted
Problems rendering a plane via `drawElements`
This looks like a case of 16bit truncation in your indice buffer. For a 257x257 grid you will be addressing more than 65536 vertices so you will need to use a 32bit indice buffer.
...
3
votes
What is the technique to generate an oblique 3d cone?
The general equation for a upright cone with the tip at $Z=0$ is
$$ 0 = X^2 + Y^2 - Z^2$$
(Ignoring the points for which $Z>0$). If you consider slices for some constant $Z$ you get circles ...
3
votes
Only show opaque objects behind transparent objects
The simplest solution is to do three passes:
Render opaque meshes to a buffer (front-to-back, depth read/write on)
Render translucent meshes to another buffer (front-to-back, depth read/write on)
...
3
votes
Accepted
How to know when rendering is complete in WebGL?
You can utilize ARB_sync or in other words sync objects which have been core since 3.2.
From the point-of-view of OpenGL then right after issuing a specific command (you want to know whether has ...
3
votes
Accepted
Emission of light from texture on WebGL
Presumably you are using a lighting system already, let's say Lambert shading for simplicity..
So we have a texture which is going to be illuminated by some light source. The following psuedo/shader ...
3
votes
Accepted
What happens to float values written to UNSIGNED_BYTE texture?
Unsigned byte textures in a graphics API are usually "normalized"—the byte values are interpreted as ranging from 0.0 to 1.0, with a byte of 255 mapping to 1.0. So no, they aren't truly floating-point ...
3
votes
Need help reasoning about video oscillation >60hz
Yeah, that makes sense. Most flat panel monitors on the market have a 60Hz refresh rate! So you are not going to be able to flicker faster than 60Hz due to technical limitation.
Were you to do this ...
3
votes
Unable to render a Waveront model in WebGL2
The problem is with how wavefront files and OpenGL work with indices.
OpenGL
OpenGL allows you to have different buffers, allowing your vertex to have multiple attributes. However, for every vertex ...
3
votes
Accepted
Is there a better, more elegant way of translating/rotating my camera in my 3d raymarched world or am I stuck with trigonometry?
A reliable way of getting the forward/left directions relative to the view is to use the camera rotation matrix itself to produce forward, Up and right vectors.
...
3
votes
Accepted
Ray Tracing With Continuous Refraction
You can refer to the available literature on the topic. The papers I am aware of are:
Ray Tracing in Non-Constant Media
Interactive Rendering of Non-Constant, Refractive Media Using the Ray Equations ...
3
votes
Accepted
Move the camera in orthographic 3D
It seems that some basic computer graphics knowledge is missing.
Normally you have two matrices for the camera (viewMatrix and projectionMatrix), both are 4x4 matrices. The viewMatrix stores the ...
2
votes
Accepted
Role of gl.vertexAttrib
gl.vertexAttribPointer is used when different vertices should have different values, and gl.vertexAttrib is used when all vertices should have the same values, and you don't want to use a special ...
2
votes
Emission of light from texture on WebGL
A self-illuminating texture is rather easy. You can use the fragmentshader to increase the color value of those pixels.
If you want a "halo"-like effect it gets more complicated. As Charlie said, you'...
2
votes
Easing curves on the GPU?
This is a pure optimisation problem. It depends on many factors like:
What you need to do with the tween
How many different tweens you need to calculate
How much signaling between systems you need
...
2
votes
Drawing a cube a million times
As suggested in the comments, there's a few ways you might be able to reduce the geometry before merging it into the big mesh and sending it out for drawing.
First of all, you might not want to draw ...
2
votes
WebGL - issues doing a simple texture downsample
The downscaled picture is not smooth because you use "nearest" filtering.
Each block of 2x2 pixels in the original image is transformed into a single pixel in the downscaled image. Put another way, ...
2
votes
How does notch's new graphics engine work?
Notch's engine most likely works using volume raymarching in a volume field. This means that you shoot rays that move a certain distance and check whether they are inside and object or not. Once they ...
2
votes
Accepted
Correctness or otherwise of the procedure for generating an orbiting camera in WebGl
Your math looks correct to me. Your terminology is a little off - technically what you are creating here is just the 'view' matrix rather than the 'modelView'. If you're just drawing a single sphere ...
2
votes
Early depth test in WebGL
In my answer I relate to WebGL 2 / Opengl ES 3.0.
As far as I know ARB_shader_image_load_store is not supported. But there is ...
Only top scored, non community-wiki answers of a minimum length are eligible
Related Tags
webgl × 86javascript × 16
glsl × 15
opengl × 12
rendering × 11
shader × 7
texture × 6
camera × 6
vertex-buffer-object × 5
lighting × 4
gltf × 4
matrix × 3
fragment-shader × 3
opengl-es × 3
transformations × 2
mathematics × 2
computational-geometry × 2
geometry × 2
perspective × 2
rasterizer × 2
physics × 2
camera-matrix × 2
data-structure × 2
buffers × 2
frame-buffer × 2