WebGL

问题 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

问题 I'm attempting to load a scene from a file into Three.js (custom format, not one that Three.js supports). This particular format describes a scene graph where each node in the tree has a transform specified as a 4x4 matrix. The process for pushing it into Three.js looks something like this: // Yeah, this is javascript-like psuedocode function processNodes(srcNode, parentThreeObj) { for(child in srcNode.children) { var threeObj = new THREE.Object3D(); // This line is the problem threeObj

问题 I want to get an accurate modulo of x and y in a WebGL fragment shader. x and y are integers. Graphing mod(x,y) , we get the following: The actual code used to generate the red-and-black rectangle is: gl_FragColor = vec4(mod( float(int(v_texCoord[0]*15.))/15., float(int(v_texCoord[1]*15.))/15. ), 0, 0, 1); Where v_texCoord is a vec2 ranging from 0,0 at the top-left to 1,1 at the bottom-right. Precision is set to mediump for both float and int. Reading the chart, we see that although mod(6,6)

问题 I'd like to normalize monochrome image pixels in that way the minimum value is black, the maximum is white and values in between are spread proportionally. Currently I do it in canvas in two steps, but I believe it should be faster in WebGL. I can imagine manipulating colors via fragment shader, but I couldn't find any efficient way for (1) determining the actual range of the image, nor (2) approach for passing this info to another fragment shader, which could then perform that grey level

问题 In Threejs, what is the most performant way to display a large number of cubes on an xyz grid for the WebGL renderer, in terms of which rendering methods/ lights/ settings/ material to use? The cubes should support receiving and casting shadows based on a directionLight -- or I can precalculate the side colors if that helps and is possible -- but they don't have any texture or special rotation. Thanks! 回答1: Be sure to merge your geometry. It helps a LOT. up to 60times more code. here is a

问题 For the past month I've been messing with WebGL, and found that if I create and draw a large vertex buffer it causes low FPS. Does anyone know if it be the same if I used OpenGL with C++? Is that a bottleneck with the language used (JavaScript in the case of WebGL) or the GPU? WebGL examples like this show that you can draw 150,000 cubes using one buffer with good performance but anything more than this, I get FPS drops. Would that be the same with OpenGL, or would it be able to handle a

问题 Edit as of 2016 : The "multiply" value is implemented for globalCompositeOperation. The performance is more than sufficient for real-time graphics. Essentially, I have two canvases (one is an invisible canvas used for drawing) and I want to blend the invisible canvas onto the visible one with the multiply blend mode. Context.globalCompositeOperation does not include multiply (though it should, in my opinion) and using imageData to manually blend the canvases is too slow (I need to be able to

问题 I have a maya model done in maya 2008. I need to be able to convert it a JSON format for use with three js. So far , I have tried 1) threeJsFileTranslator.py which is a maya plugin to export a model and is provided as a part of the threejs package. 2) MDD-OBJ-EXPORTER - with this , I was successfully able to import the animated model into blender but when I tried to export it to threejs , the js file didn't work. I am breaking my head over this from the past 2 weeks. So please bear with me if

问题 I want to send a buffer list (to the GPU/vertex shader) which contains information about vertex position, world position, color, scale, and rotation. If each of my 3D objects have transformation related information in a matrix, how can i pass this array of matrices (in addition to the other vertex data) to the GPU via the VBO(s) ? Updated Please excuse any typos: // bind & set vertices. gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer); gl.vertexAtribPointer(a_Position, 3, gl.FLOAT, false, stride,

问题 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 like the rifle in the bottom image. Does anyone know how I would achieve the two effects? Any help is greatly appreciated. 回答1: In 3D terms, this is called a "billboard". A billboard is completely flat 2D plane with a texture on it and it always faces the camera. See here for a pure OpenGL implementation: