Search Results
Search type | Search syntax |
---|---|
Tags | [tag] |
Exact | "words here" |
Author |
user:1234 user:me (yours) |
Score |
score:3 (3+) score:0 (none) |
Answers |
answers:3 (3+) answers:0 (none) isaccepted:yes hasaccepted:no inquestion:1234 |
Views | views:250 |
Code | code:"if (foo != bar)" |
Sections |
title:apples body:"apples oranges" |
URL | url:"*.example.com" |
Saves | in:saves |
Status |
closed:yes duplicate:no migrated:no wiki:no |
Types |
is:question is:answer |
Exclude |
-[tag] -apples |
For more details on advanced search visit our help page |
WebGL is a Javascript API for rendering interactive 3D / 2D graphics on the HTML5 canvas element. It is based on OpenGL ES 2.0.
2
votes
How to rotate something around a fixed point WebGL
One way is using a matrIx stack
https://webglfundamentals.org/webgl/lessons/webgl-2d-matrix-stack.html
Basically you need to translate the object so it's center point is at the origin, rotate, then translate …
3
votes
Which UVs to use when I have more UVs coordinates than vertices Obj
You are using the wrong UV coordinates and yes, it's normal to have more UVs than positions.
Consider a cube. A cube has 8 positions but for correct normals it needs either 3 normals per position sin …
3
votes
Accepted
WebGL: Texture appears as black
You need to set the texture parameters for non-power of 2 textures. Adding these 2 lines fixed the issue
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri …
2
votes
How can I center a WebGL window in Unity?
gameContainer", "Build/dist.json");
</script>
</head>
<body>
<div id="gameContainer"></div>
</body>
</html>
Then you pick Edit->Project Settings->Player from the menus and under the WebGL …
5
votes
How can I implement 3D textures using webgl?
Here's the GLSL function slightly fixed from the Google I/O talk
#define FILTER_LUT true
vec4 sampleAs3DTexture(sampler2D tex, vec3 texCoord, float size) {
float sliceSize = 1.0 / size; …
0
votes
Missing features from WebGL and OpenGL ES
One way to look at it is WebGL is OpenGL ES 2.0 and OpenGL ES 2.0 is OpenGL with all the legacy cruft removed. … WebGL/OpenGL ES 2.0 is basic vertex and fragment shaders. …
1
vote
Unstable sampled color in GLSL shader
Being that it's WebGL it seems like it would be easy to post a simple example. Make a texture using canvas2d. Put a red block and and a blue block in the texture. …
1
vote
Rendering a 2D tree in WebGL
And then you can still draw out of order
As for "orthographic projection" neither WebGL nor OpenGL require any kind of projection. … Projection is a term left over from the old fixed function pipeline that is not part of modern OpenGL or WebGL. …
2
votes
Accepted
unity webgl scale page on different sizes of internet browsers on pc or phone
gameContainer", "Build/dist.json");
</script>
</head>
<body>
<div id="gameContainer"></div>
</body>
</html>
Then you pick Edit->Project Settings->Player from the menus and under the WebGL …
2
votes
How to copy text from an InputField to the clipboard in WebGL?
On copy ask the inputfield to copy then pass unity's clipboard back to the browser
Here's some code and a working example
https://github.com/greggman/unity-webgl-copy-and-paste …
2
votes
Accepted
"RENDER WARNING: there is no texture bound to the unit 0" When not Rendering Texture
sampler2D tex;
uniform vec4 u_color;
void main() {
vec4 t_color = texture2D(tex, gl_PointCoord.xy);
gl_FragColor = u_color * t_color;
}
`;
const gl = document.querySelector('canvas').getContext('webgl …
2
votes
Accepted
Unpacking Sprite Sheet Into 2D Texture Array
(gl.TEXTURE_2D_ARRAY, tex);
const levels = 7;
const width = 128;
const height = 128;
const depth = 8;
gl.texStorage3D(gl.TEXTURE_2D_ARRAY, levels, gl.RGBA8, width, height, depth);
// Tell WebGL … the size of one row
gl.pixelStorei(gl.UNPACK_ROW_LENGTH, img.width);
for (let d = 0; d < depth; ++d) {
const xoff = d % 4 * width;
const yoff = (d / 4 | 0) * height;
// Tell WebGL where …
0
votes
Noisy edges, smoothing out edges between faces via fragment shader
I'm sure that "could" be solved with some image algorithm but if it was me I'd probably solve it with textures. I'd make hexagonal textures, put them all in a texture atlas, then for each hexagon I'd …
4
votes
Accepted
Efficient Dynamic Memory Management
deleteBuffer will delete the buffer in WebGL (and OpenGL) but I'm just curious, is there any reason not to just reuse the same buffer just put new data in it? (eg. have a pool of buffers?) …
2
votes
Accepted
What are "free vertex indices" in WebGL 2 and how do they relate to geometry shaders?
I'm just guessing it's using gl_VertexID to generate vertices in the shader. Example:
function main() {
const gl = document.querySelector("canvas").getContext("webgl2", { alpha: false });
if …