WebGL

问题 I've already done some projects with c++ and OpenGL, now I'm creating a simple project with html5 and WebGL. The problem is, after I rotate the camera, the movement is always along the default axes and not along the rotated ones. For example: I move forward -> no problem, I rotate the camera by 90 degrees right -> no problem, now I aspect that, if I go forward, the camera goes right on the world axes (so in front of the camera, as an FPS game) but the camera goes always towards the starting z

问题 This appears to be a bug with Chrome, but just in case someone has come up with a simple CSS workaround. I've filed a bug report with a test case and there is also a JSFiddle. The issue is when transforming an element with backface-visibility: hidden . If there is a child element with a WebGL context, Chrome will display it anyway. Setting transform-style: preserve-3d or backface-visibility: hidden directly on the canvas make no difference. It works correctly if the transform is only applied

问题 I'm doing a project using webGl and Three.js. My problem is only one: I need to deallocate memory because, during the game, i have to create a lot of object so i don't want to allocate an huge size of memory. I tried a lot of "code", but nothing happened.. For now I use this: function deallocazioneScena(){ for ( var i = scene.children.length - 1; i >= 0 ; i -- ) { deallocazioneObj(scene.children[i]); } //camera.position.set(0,50,70); } function deallocazioneObj(obj){ scene.remove(obj); if

问题 I learn WebGL . I see the tutorial has the code of shaders inside of JavaScript code as a usual string. For example: var VSHADER_SOURCE = 'void main(){\n' + ' gl_Position = vec4(0.0, 0.0, 0.0, 1.0);\n' + ' gl_PointSize = 10.0;\n' + '}\n'; I want to place the code of my shaders into the external text files and load them into my JavaScript code when it necessary. How can I do it right? I don't want mix the JavaScript code and shader code in the same source code file. I looked the sample

问题 What is the difference between window.WebGLRenderingContext and canvas.getContext('experimental-webgl') ? I've searched a lot, but I can't find the answer. Thanks in advance, 回答1: canvas.getContext will return a drawing context for that particular canvas (see spec §2: Context Creation). It will likely inherit from the global and static window.WebGLRenderingContext object, which exposes the WebGLRenderingContext interface (spec §5.14). A browser does not need to expose those native interfaces

问题 Using Fabric.js, I'm having trouble truly rotating a triangle around its center point, or at least what I believe should be the center point. I created a jsFiddle that demonstrates. The triangle is simple, and I used originX: 'center' and the same for originY, however as the triangle is rotating, there is still slight movement in the x and y directions. How do I make sure that the triangle never moves? I found this answer and was wondering if this is the right path to take? how to rotate

问题 I am trying to digest these two links: https://www.khronos.org/opengl/wiki/Rendering_Pipeline_Overview https://www.khronos.org/opengl/wiki/Vertex_Shader The pipeline overview says that vertex shader runs before the primitive assembly. The second one mentions this: A vertex shader is (usually) invariant with its input. That is, within a single Drawing Command, two vertex shader invocations that get the exact same input attributes will return binary identical results . Because of this, if

问题 Is that possible to interact with the buffer used when merging multiple mesh for changing color on the selected individual mesh ? It's easy to do such thing with a collection of mesh but what about a merged mesh with multiple different material ? 回答1: Depends on what you mean with "changing colors". Note that after merging, the mesh is like any other non-merged mesh. If you mean vertex colors, it would be possibly to iterate over the faces and determine the vertices which color to change

问题 I have a 3D mesh. Is there any possibility to render the sectional view (clipping) like glClipPlane in OpenGL? I am using Three.js r65. The latest shader that I have added is: Fragment Shader: uniform float time; uniform vec2 resolution; varying vec2 vUv; void main( void ) { vec2 position = -1.0 + 2.0 * vUv; float red = abs( sin( position.x * position.y + time / 2.0 ) ); float green = abs( cos( position.x * position.y + time / 3.0 ) ); float blue = abs( cos( position.x * position.y + time / 4

问题 * Edited with better example * I use Three.js to display the hull of an MRI gastric image; the hull is loaded from an external file as vtk format. Here is a demonstration: http://www.menne-biomed.de/uni/3d/alphahull.html ; use space to toggle. These are alpha-hulls computed from voxels as nicely three.js displayed in http://www.menne-biomed.de/uni/3d . I love these images. Thanks a log, Mr.doob!! Example 1-3 are from an almost empty stomach; 4-6 are from a filled stomach. (1) and (4) are