WebGL

Prevent loop unwinding in fragment shader

∥☆過路亽.° 提交于 2020-01-03 13:30:36
问题 I'm writing a fragment shader for WebGL(GLSL ES 1.0) using the latest version of Chrome(and Firefox), and I wrote an iterative algorithm. So first of all, I found out the hard way that the length of the loop is quite restricted (doc says it must be guessable at compile-time, which means it must be a constant or very close). In addition, I must write a ( for , since it's the only one which must be implemented according to the standard) loop that's potentially long but that breaks almost every

how to achieve a cross fade between different cameras / scenes in three.js?

我的未来我决定 提交于 2020-01-03 03:25:15
问题 Is it possible, and if so, what is the best way to achieve the following effect in three.js: I am displaying scene S1 as viewed from camera C1and from there: crossfade to scene S2 as viewed from camera C2, or crossfade to scene S1 as seen from camera C3 Any assistance helping me think about this will be greatly appreciated! 回答1: Something like this is pretty easy: Use 2 rendertargets to draw the different scenes from the different cameras Use both rendertargets with this blend shader https:/

Can one fragment access all texture pixel values in WebGL GLSL? (Not just it's own TexCoord)

心已入冬 提交于 2020-01-03 00:56:33
问题 Let's pretend I'm making a compute shader using WebGL and GLSL. In this shader, each fragment (or pixel) would like to look at every pixel on a texture, then decide on it's own color. Normally a fragment samples it's provided texture coordinate (UV value) from a few textures, but I want to sample effectively all UV values from a single texture for a single fragment. Is this possible? 回答1: EDIT: I was able to sample from each pixel in a 128x128 texture, but moving to 256x256 causes Chrome to

WebGL: async operations?

时光毁灭记忆、已成空白 提交于 2020-01-02 12:03:44
问题 I'd like to know if there are any async calls for WebGL that one could take advantage of? I have looked into Spec v1 and Spec v2 they don't mention anything. In V2, there is a WebGL Query mechanism which I don't think is what I'm looking for. A search on the web didn't come up with anything definitive. There is this example and is not clear how the sync and async version differ. http://toji.github.io/shader-perf/ Ultimately I'd like to be able to some of all of these asynchronously:

WebGL: async operations?

偶尔善良 提交于 2020-01-02 12:01:13
问题 I'd like to know if there are any async calls for WebGL that one could take advantage of? I have looked into Spec v1 and Spec v2 they don't mention anything. In V2, there is a WebGL Query mechanism which I don't think is what I'm looking for. A search on the web didn't come up with anything definitive. There is this example and is not clear how the sync and async version differ. http://toji.github.io/shader-perf/ Ultimately I'd like to be able to some of all of these asynchronously:

Uniform vertex displacement for skinned mesh shader (Animated outline, Three.js)

孤街浪徒 提交于 2020-01-02 04:07:28
问题 I think I've solved implementation of rendering borders/outlines over meshes in Three.js, a technique many games use for highlighting objects/characters. Diablo 1 and 3 for example Here are details and demo of my solution. Now what remains to be done are animated meshes (for characters etc). The problem is, skinned mesh is animated with a vertex shader and I also used a shader to scale (displace) the mesh out along the normals. It might be pretty straight-forward but unfortunately my math

Hide faces with GLSL shader

五迷三道 提交于 2020-01-01 22:29:12
问题 I'm trying to wright a shader to work with three.js. Which is a javascript library for WebGL. I just started reading up on GLSL so there are some thing i'm having trouble with. Basically I want reveal and hide faces of a geometry. I have cloned my geometry's face array and reordered it. The reordered array has the faces in the order I would like to reveal/hide them. I have read that Uniforms can be access from anywhere within the pipeline. Can I just declare the array as a Uniform and access

2D zoom to point in webgl

北慕城南 提交于 2020-01-01 14:39:47
问题 I'm trying to create a 2D graph visualization using WebGL (regl, to be more specific). With my current implementation I can already see the force layout being applied to each node, which is good. The problem comes when I try to zoom with respect to the current mouse position. According to my research, to achieve this behavior, it is necessary to apply matrix transformations in the following order: translate(nodePosition, mousePosition) scale(scaleFactor) translate(nodePosition, -mousePosition

2D zoom to point in webgl

不想你离开。 提交于 2020-01-01 14:39:07
问题 I'm trying to create a 2D graph visualization using WebGL (regl, to be more specific). With my current implementation I can already see the force layout being applied to each node, which is good. The problem comes when I try to zoom with respect to the current mouse position. According to my research, to achieve this behavior, it is necessary to apply matrix transformations in the following order: translate(nodePosition, mousePosition) scale(scaleFactor) translate(nodePosition, -mousePosition

using WebGL index buffers for drawing meshes

血红的双手。 提交于 2020-01-01 12:16:34
问题 3 index buffers asks a more difficult question, but I feel like their main problem boils down to mine: is there a way to use index buffers to visit the same vertex multiple times in WebGL rather than duplicating the vertices? All I was able to find is using index buffers to associate textures, normals, etc. to vertices in a model. I wasn't able to find a way to use an index buffer to tell drawArrays the order in which to visit the vertices in a position array. 回答1: Yes, use gl.drawElements