Skip to main content

Questions tagged [webgl]

WebGL is a Javascript API for rendering interactive 3D / 2D graphics on the HTML5 canvas element. It is based on OpenGL ES 2.0.

Filter by
Sorted by
Tagged with
0 votes
1 answer
4k views

Resizing canvas to match screen size in Unity WebGL

I'm learning how to make a browser game with Unity. I have set up the screen display dimensions to 960 x 640 (I read that it's a safe resolution to use. Feel free to correct me). I created a Canvas ...
0 votes
1 answer
558 views

What is the best rate at which to send updates to clients for a first person shooter NodeJS WebSocket server?

I developed a multiplayer FPS using WebGL, Nodejs and WebSockets. So far it is running great. I am currently using setInterval(sendPlayerPositions, 16); to send updates to WebGL clients. Ideally I ...
0 votes
1 answer
31 views

The WebGL version of my game does not load the next scene when using an async action

I've just created a WebGL build for my puzzle game in Unity. While the Windows version worked just fine, I encountered a bug on the web: it cannot load the next level when you collide with the goal. ...
0 votes
0 answers
42 views

`textSubImage2D` inconsistent performance

I have a problem when creating a texture with WebGL. The thing that I do not understand is that the first call with texSubImage2D with a canvas leads to the ...
1 vote
1 answer
1k views

How to fit game to screen size?

I create a WebGL game. After building project I discovered that the game doesn't fit the screen size How you can see the canvas is perfectly scaled but the game didn't I don't know what I changed but ...
5 votes
1 answer
682 views

What causes some web game engines work in "slow mo" mode instead of reducing FPS but continuing to show the true time/tick state of things?

I used game engines that are capable of cross-platform export: Cocos Creator, Godot, Unity, others. Some game engines have this thing, called "physics update" or "fixed update". ...
0 votes
2 answers
335 views

OVR Lip Sync in Unity WebGL project

I am using the Oculus VR (OVR) Lip Sync Plugin for an avatar in a Unity project which I want to deploy to a browser using WebGL. The issue is that WebGL doesn't support Unity's ...
0 votes
0 answers
77 views

How to draw a small circle 20px in webgl using JavaScript?

I could use triangles (make them using trigonometry). But the circle I want is small, only 20px diameter. I could also load a model but I need a quick solution. Is there an easy method to draw a small ...
1 vote
1 answer
2k views

How to position/transform vertices for 2D UI in shaders?

I am building a 3D engine and have a rendering abstraction that focuses on writing shaders. Most my 3D shaders have gl_Position output like: ...
0 votes
0 answers
39 views

Javascript global variable doesn't update

Here is the scenario, I have a GetImageAerial.jslib which has function something like this ...
12 votes
3 answers
1k views

How to hide a post-processed mesh outline when/where the mesh is hidden

I'm working on setting up an active outline in my 3d engine, a highlight effect for selected 3d characters or scenery in the screen. After working with the stencil buffer and getting some ...
0 votes
1 answer
116 views

Unity Mirror Networking Audio Behaves Differently on Host and WebGL Client

I am creating a system in Unity using Mirror Networking which will only require one host/server and one client. It is a WebGL build so the client will connect on a browser. I want to send commands ...
0 votes
0 answers
46 views

How to trigger a local file download for a screenshot from a Unity WebGL game?

Is it possible for a Unity WebGL app to trigger a local file download - binary data generated in the app, somehow triggering a browser download?
1 vote
1 answer
85 views

Character walks too fast when browser's hardware acceleration is turned off

I have posted a project on itch.io (here). My character walks with the speed I intended when Chrome's hardware acceleration is turned on but walks much faster when it is turned off. First, my friend ...
0 votes
0 answers
49 views

Uncaught Syntax Error: Unexpected token .. Doc type is not valid json error

I've a Unity WebGL game. When I try to load my game hosted on an Ubuntu 20.04 + apache 2.4 server, I get this error: Uncaught Syntax Error: Unexpected token .. Doc type is not valid json. I've ...
0 votes
0 answers
36 views

Shadow squares on meshes

I had created project on r3f (React THREE Fiber), and after "blocking" when I decided to add high resolution models, I noticed this shadow issue. Help me to understand, how can I fix the ...
0 votes
0 answers
78 views

Export Blender models and (procedural) material to Browser?

Given that Verge3d cannot support Volume input, or volumetric shader property in the material output node. Using WebGl 2, and possibly 3.js, is it possible for me to export my blender models and their ...
0 votes
1 answer
241 views

WebGL FPS is sometimes higher than max. FPS setting - why?

In lots of WebGL online games (all games I tested were made with Unity), my FPS is sometimes higher than the max, FPS setting of my PC (75), but why?
3 votes
2 answers
600 views

How to implement user friendly screen panning on 3D HTML canvas for RTS game

How can I get RTS map panning like how it was done in C&C red alert (with the mouse at the edge of the screen moves the screen in that direction) with a Babylon.js RTS game in the html canvas? ...
0 votes
1 answer
65 views

BasisParser returns undefined from loading KTX2 file with custom extension

I get 'undefined' from the BasisParser that I use from Pixi itself, when loading a KTX2 file with a custom extension (through Assets.load): ...
4 votes
2 answers
572 views

Why use sprite tile maps on the GPU in WebGL?

I'm trying to figure out the best way of rendering my layered tiled maps with WebGL, and have come across this tutorial several times: https://blog.tojicode.com/2012/07/sprite-tile-maps-on-gpu.html ...
0 votes
1 answer
548 views

Add a rounded border to a texture with a fragment shader

I am trying to draw a rounded border / outline around a texture. Basically I have two textures doing a transition and the border should look like being part of the textures itself. I tried different ...
-1 votes
2 answers
515 views

Unity WebGL Progress bar never moves but game finishes downloading and works

Not sure why but the progress bar never moves for WebGL in Chrome, but the game downloads and works? Using Unity 2020.1.14f1 brotli WebGL builds
2 votes
2 answers
10k views

Adding multiple materials to a single mesh in three.js

I've been doing some reading and can't seem to figure out a good way to do this.. I have a simple globe with a material on it like so: ...
0 votes
1 answer
50 views

Semi transparent objects show fuzzy halos when in shadow

I'm having some issues when drawing a semi transparent object after an opaque object, and the object is in the shadows. On the left, the torch is rendered just fine, I can see a nice blend of the ...
1 vote
0 answers
1k views

BuildFailedException: Incremental Player build failed!

I'm trying to build simple project with only one shape in WebGL, and I get these 4 errors. I tried to install again and it's still not working. ...
1 vote
1 answer
6k views

How to copy text from an InputField to the clipboard in WebGL?

I would like to know if there is a solution to copy/paste the text from/to an InputField in a WebGL Unity app. For security reasons, Unity WebGL doesn't allow text copy and paste in/from browser.
1 vote
2 answers
244 views

How to publish WebXR game on Quest or Steam stores?

I would like to develop a simple and small game for WebXR so that Quest, Index, etc. can play it. I would eventually like to be able to put it on the Quest store and Steam. Is there a way to publish a ...
0 votes
1 answer
73 views

Align two meshes given 2 faces

I have two meshes (A and B) and I know that a triangle in A has the same size and same angles as a triangle in B. For simplicity, suppose A is an octahedron and B is a tetrahedron. And suppose the ...
1 vote
0 answers
36 views

WebGL 2.0: Attaching a shader object to a game object

I'm making a 2d game engine using Java Script and WebGL, both of which I am new to, and was wondering if it was a good idea to use a shader object to initialize the fragment and vertex shader and then ...
0 votes
2 answers
840 views

How to create global function for all .JSLIB files?

I can't understand how to work with .jslib files. I don't understand the syntax of this type of file. Also I couldn't find any easy explanation of it The problem ...
0 votes
0 answers
845 views

Client says they want Unreal scene viewable in a web browser 😳 last minute

I have a job that I did for a client and the client wants the project to be viewable in a web browser. I looked into it and all I found was people telling me that it's impossible, but this is a low ...
0 votes
0 answers
100 views

Gaussian blur only blurs the interior of primitive?

I cannot work out why my blur shader based on this example affects only what's inside the illuminated sphere. Below is the loop I'm using to blur an HDR framebuffer 5 times horizontally and vertically ...
0 votes
0 answers
89 views

How to listen for a TCP message?

I want to create a Unity WebGL application, that will run in a browser. I want to allow this application to "listen" for messages, so it needs to be a server. What could be the developing ...
0 votes
0 answers
49 views

A blob moving through a pipe that contracts and deforms

I want to have a pipe with elastic walls that one or more blobs can move into which stretch the pipe. I also want the pipe to be able to contract in diameter and have pressure applied from the outside ...
13 votes
1 answer
4k views

How to do color post processing in WebGL, when you can not read the color of the current pixel?

In a WebGL 2 GLSL fragment shader, one can not access the pre-existing color value of the current pixel, i.e. the color that is already there in the framebuffer before the pixel that is currently ...
0 votes
1 answer
305 views

Efficiently pass one uniform value per polygon or quad to the fragment shader in a single batched draw call in WebGL?

I want to render multiple colored quads, with one solid color per quad, using WebGL 2.0 and Javascript. However, this question is probably generalisable to other OpenGL implementations as well. The ...
0 votes
2 answers
614 views

How does lookAt matrix math work?

Can someone provide me an explanation of how the lookAt matrix works? ...
0 votes
0 answers
45 views

WebGL fragment shaders for SNES S-PPU?

I’m not very experienced with WebGL and want to ask if this project is potentially feasible and also for a few hints about what direction I may want to take. I’d like to implement all of the logic ...
2 votes
1 answer
144 views

Array of script class references in inspector

I'm trying to remove the Reflection part of one of my scripts so it works in WebGL, however I am having some trouble. Basically I need a way to store references to classes in an Inspector array so ...
0 votes
1 answer
422 views

View Space From gl_FragCoord

Trying to get the example code for CalcEyeFromWindow() (first one on the page) to work in WebGL, but having no luck. Paired down the code to the following with some explicit values just in case ...
3 votes
3 answers
2k views

What are "free vertex indices" in WebGL 2 and how do they relate to geometry shaders?

In January Notch tweeted about WebGL 2: WebGL 2 is happening. Bye, compatibility! Hello, 3d textures and pixel buffers! oh god it's got free vertex indices in the shader. That is basically a geometry ...
0 votes
1 answer
948 views

How can I import an Excel file in an Unity WebGL game?

Currently, we have a project that runs on Windows and uses an Excel spreadsheet to save/retrive some data/information. Now we want to build that project for WebGL. The problem is that file reading ...
0 votes
1 answer
197 views

Why is this shader using multiple render targets not working?

I have a webgl shader that uses multiple render targets. This one only renders to one texture for now. However, I plan that this shader shall render more. However, as soon as I add layout qualifiers, ...
0 votes
0 answers
657 views

How to decompose a GLSL mat4 to original RTS values within vertex shader?

I need to get the rotation differences between the model and the camera. convert the values to radians/degrees and pass it to the fragment shader. for that I need to decompose and the Model rotation ...
0 votes
1 answer
119 views

How to add a texture that follows the movement?

I would like to move my landscape to simulate a world moving on the x-axis. I use createPattern() to add an image inside my path, but the pattern draws the image at ...
1 vote
0 answers
419 views

Cursor trail with fragment shader

I wish to draw a simple mouse trail using fragment shaders, similar in appearance to drawing the following in processing (omitting the step of clearing the canvas). I cannot wrap my head around the ...
0 votes
0 answers
431 views

Error when opening a minimal Unity WebGL game on itch.io

I created a very simple game in Unity 2020, built it to WebGL, and uploaded it to itch.io. When I open the game, I see the following error: ...
2 votes
0 answers
16 views

UV interpolation gets distorted on a trapezoid [duplicate]

I'm experiencing an interesting distortion in the UV mapping of a trapezoid. When I map a square plane and tilt it backwards, the perspective-correct interpolation gives it the expected pinching at ...
0 votes
0 answers
204 views

Shader from urp shader graph turns gray on webgl1 build

When I build my game while graphics API is set to webgl1 the shader is just a gray texture. It works fine if graphics API is set to webgl2 but I need it to work on webgl1. Can shader graph shader ...

1
2 3 4 5 6