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

learn more… | top users | synonyms

1
vote
3answers
411 views

Can Simple Direct Media Layer be used with WebGL?

I have read that on desktop OpenGL + SDL is a great way to learn. In looking at WebGL I couldn't find a Web version of SDL. On their site I see bindings for all sorts of languages, but no JavaScript. ...
4
votes
3answers
862 views

why is it faster to draw lots of small arrays than one big array?

This application on-line here has interesting performance characteristics: Sorting the rectangles to be drawn so it keeps having to change colour is faster than sorting the rectangles by their colour ...
2
votes
1answer
294 views

mat3x4 in webGL shaders

I am porting the IQM bone animation format to Javascript and have run into a problem... The vertex shader is failing to compile and the only error message I get out is 'mat3x4' : syntax error on the ...
-4
votes
2answers
203 views

enemy shooting towards FPS [closed]

WELL first of all I want you to see my game (its deployed on heroku cloud) : http://still-escarpment-3701.herokuapp.com (It takes almost 10 sec to load so please wait for couple of sec) I have ...
1
vote
0answers
460 views

shader-based particle systems

I have a classic particle system where each particle is represented by a quad and, each time step, I move each particle. My target is webGL which means I don't have instancing, attribute divisors nor ...
-5
votes
1answer
577 views

How can I create a WebGL camera based on quaternions?

I am trying to create a WebGL camera based on quaternions. I looked at many tutorials, and none is as simple as it could be or it was not working. How can I create such a camera?
0
votes
1answer
303 views

best way of rendering more 3D models in three.js that not slow down page?

I am in the way of creating a 3D web game using threeJS library. This is a multi-player game that players are 3D human models in game, and I need to add a human 3D model for each player that enters ...
1
vote
1answer
377 views

WebGL: Texture appears as black

I have a simple WebGL canvas, where I'm attempting to render a texture on a square. When working with textures as local files, all is fine. But when I try to load a texture from the web, I get a black ...
5
votes
1answer
1k views

What's the difference between Canvas and WebGL?

I'm thinking about using CAAT as a part of a HTML5 game engine. One of it's features is the ability to render to Canvas and WebGL without changing anything in the client code. That is a good thing, ...
2
votes
2answers
4k views

Rotate sphere in Javascript / three.js while moving along x/z plane

I have a sphere/ball in three.js which I want to "roll" around on the x/z plane. For the z axis I could simply do this no matter what the current x and y rotation is: sphere.roll_z = ...
4
votes
3answers
3k views

List of 3D libraries based on WebGL [closed]

Is there a up-to-date list of WebGL libraries or articals with comparison? Until now I heard only three.js and GLGE.
1
vote
4answers
2k views

How can I use WebGL to create a tile-based multi-layer scrolling platform game?

I've found WebGL (based on OpenGL) to be a fiendish and unforgiving framework for those learning to write HTML5-based games. Despite the presence of many examples on how to get started, I'm really ...
0
votes
0answers
31 views

How do i draw a volume cube and fill it up with a 3D texture in webgl? [duplicate]

Possible Duplicate: How can I implement 3D textures using webgl? I have a set of (x-y) images of the cross-section of an object varying along the z-dimension. From that i have to construct ...
0
votes
1answer
1k views

How can I implement 3D textures using webgl?

I went through the google I/O video but did not get exactly how to do it. If somebody could point me to a simple 3D texture implementation using webgl, it would be helpful. i basically have a volume, ...
5
votes
1answer
2k views

GLSL pack floats into an RGBA texture

I want to compose conventional triangle-based models and particles with a ray-traced scene at a reasonable frame-rate. webGL does not let you write the gl_FragDepth in the fragment shader. You ...
1
vote
2answers
324 views

What kind of physics to choose for our arcade 3D MMO?

We're creating an action MMO using Three.js (WebGL) with an arcadish feel, and implementing physics for it has been a pain in the butt. Our game has a terrain where the character will walk on, and in ...
2
votes
2answers
1k views

How to rotate an object so it stands correctly (back always facing the camera)

I have the following scene: And I have two 3D vectors, the camera position, and the focus position. The focus vector is always behind the monster. I know how to rotate the camera around the focus ...
1
vote
2answers
526 views

How is JS source protected in Chrome games?

I was playing a space arcade shooter https://moonbreakers.com/ and tried to see some of the JS and shader code. However, I was unable to find anything but some server communication code. Game code is ...
0
votes
2answers
5k views

Best physics engine for OpenGL ES (different implementations)? [closed]

Can you recommend a good physics engine which is easily portable between WebGL and other OpenGL ES implementations like in Android and iPhone? I don't want a game engine. Only the physics part.
1
vote
1answer
627 views

Problem when animating MD5 model (GPU Skinning)

I'm trying to implement a GPU skinning version of the md5mesh.js by @tojiro (demo with CPU skinning) in WebGL (live demo of the project here, use WASD to move the camera around). The main concept is ...
3
votes
2answers
2k views

How to animate a model in WebGL?

I created a human model in Blender, exported the vertices and indices into a JSON file and render the model in a browser using WebGL. Now I created a walk and jump animation in Blender and would like ...
2
votes
2answers
963 views

Why is my quaternion camera rotating around strange axes?

I can't get it to work for the life of me. Its rotating the camera in the global coordinate system, or some other random coordinate system, not the camera local coordinate system. WASDEC work ...
3
votes
2answers
483 views

What is UVIndex and how do I use it on OpenGL?

I am a noob in OpenGL ES 2.0 (for WebGL) and I'm trying to draw a simple model I've made with a 3D tool and exported to .fbx format. I've been able to draw some models that only have: A vertex buffer, ...
12
votes
3answers
4k views

Is there a way to use an arbitrary number of lights in a fragment shader?

Is there a way to pass an arbitrary number of light locations (and colors) for the fragment shader, and loop over them in the shader? If not, then how are multiple lights supposed to be simulated? ...
1
vote
1answer
168 views

How do I draw a multi-object mesh at once?

This is a very elementary question. At the moment I am drawing lots of faces separately by setting a location uniform separately for each one of them. This is very slow. As I understand it, the ...
3
votes
2answers
463 views

Is there any reason for doing back face culling in software?

I, a newbie, have been doing back face culling in javascript for my WebGL app because I didn't know gl.cullFace() existed. Is there any reason to use software-based culling instead of just passing all ...
3
votes
2answers
554 views

WebGL geometry calculations

I have a dynamic surface in WebGL, that is animated in vertex shader. I want other objects to interact with this surface (for example, an object riding on dynamic terrain). What's the best way to do ...
0
votes
1answer
203 views

3d immersive Virtual Conference meeting environment development on the web (3d website)-Help required [closed]

I want to develop 3d immersive virtual collaborative conference meeting environment on the web i.e an immersive virtual environment for our university Teachers to attend and address conference ...
5
votes
1answer
752 views

How do I create a blob shadow under a character?

I have a webgl based 2.5D platformer game, and I would like to add a simple blob shadow under the character to help the player with the platforming. How is this normally done? As you can see below, ...
7
votes
2answers
2k views

Why must the transpose value of glUniformMatrix4fv in webgl/OpenGL ES be false?

Why must the transpose value of glUniformMatrix4fv in webgl/OpenGL ES be false? The OpenGL ES spec says that the transpose value must be false or an INVALID_VALUE is generated. Why then have the ...
3
votes
2answers
2k views

Disable V-sync in WebGL?

Normally my app runs at 60 fps, But when I add some simple models it decreases to 40fps. I think v-sync on, which is might be causing it to run slower. Is there any way to disable v-sync in WebGL? ...
1
vote
1answer
1k views

WebGL rendering performance and frustum culling

When I render five boxes in WebGL with one texture for all of them, the app runs at 60 FPS, nice. But when I render 70 boxes the performance decreases to ~40fps... but only 5 of the boxes are visible. ...
1
vote
1answer
234 views

Can you have shader variables that vary per primitive?

A shader normally has values that vary per-vertex and values that vary per-fragment. Can you have values that vary only per primitive, such as per-triangle or per-quad?
0
votes
3answers
1k views

How do I create menu with text in OpenGL?

How would I go about creating a menu system with fonts in OpenGL? I want to make a dungeon crawler and will need a menu for inventory and stats for the weapons. I can draw a world made out of blocks ...
2
votes
1answer
562 views

What are the texture coordinates for a tetrahedron

EDIT This is the WebGL code for initializing the tetrahedron points. You may want to skip to the second code block, because you may be able to answer without this. //Making a tetrahedron with ...
3
votes
1answer
2k views

Unity3d or WebGL: Where should I go?

I am interested in making a simple 3D game this summer, and I'd prefer if it were playable in a browser. My choices I am considering are Unity and WebGL. Currently I have no experience in either. But ...
5
votes
4answers
3k views

Can't understand these UV texture coordinates (range is NOT 0.0 to 1.0)

Hey, hello guys, I am trying to draw a simple 3D object generated by Google SketchUp 8 Pro onto my WebGL app, the model is a simple cylinder. I opened the exported file and copied the vertices ...
4
votes
1answer
3k views

How to create a perspective field of view matrix?

Hey, hello. I am learning a little of WebGL (OpenGL ES 2.0) through the http://learningwebgl.com tutorials, but it uses a third party library to create the View, Projection and transformation matrices ...
9
votes
4answers
3k views

How to implement mouselook in the browser?

I am currently creating a 3D first-person shooter game in the browser using WebGL. How would I implement mouselook/free look for such a game?
2
votes
5answers
2k views

Are there any good html 5 mmo design tutorials? [closed]

Hey all. I got a rather inspired after playing gaia online's zOMG and wanted to revive an old project idea I've had laying around for a few years now. I'm looking to work with html5 (ie canvas, svg ...
2
votes
1answer
1k views

Separate shaders from HTML file in WebGL

I'm ramping up on WebGL and was wondering what is the best way to specify my vertex and fragment shaders. Looking at some tutorials, the shaders are embedded directly in the HTML. (And referenced via ...
7
votes
2answers
1k views

Missing features from WebGL and OpenGL ES

I've started using WebGL and am pleased with how easy it is to leverage my OpenGL (and by extension OpenGL ES) experience. However, my understanding is as follows: OpenGL ES is a subset of OpenGL ...
2
votes
2answers
908 views

How do I employ an arcball to allow the user to look around the screen?

How do I apply an arcball (using quaternions) along with mouse events, to allow the user to look around the screen using the o3d WebGL framework? This sample uses the arcball for rotating the ...
25
votes
10answers
8k views

Browser-based MMOs (WebGL, WebSocket) [closed]

Do you think it is technically possible to write a fully-fledged 3D MMO client with Browser JavaScript - WebGL for graphics, and WebSocket for Networking? Do you think future MMOs (and games ...
4
votes
1answer
2k views

Rendering 2d sprites into a 3d world?

In opengl how do I render 2d sprites in opengl given that I have a png of the sprite? See images as an example of the effect I'd like to achieve. Also I would like to overlay weapons on the screen ...
3
votes
2answers
485 views

Does anyone have a sample for drawing a subdivided icosahedron in javascript, that they would be able to share?

Does anyone have a sample for drawing a subdivided icosahedron in javascript, that they would be able to share?
5
votes
3answers
5k views

How do I load Collada models into a WebGL app? [closed]

I have written some simple apps following the tutorials on http://learningwebgl.com. What is the simplest way to load and display Collada model files, particularly the files available from Google 3D ...