WebGL

问题 I create a little application in WebGL, I have two objects which move, a cube and a sphere. I modify objects with shaders, each object have it shader. So I want update objects on the display at determine time, for this I use drawElements function. For each object I have a buffer which contains indices of faces in vertices buffer : gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STREAM_DRAW); indexCount = indices

问题 Safari on iOS 8 supporting webgl is surely a good news but after I run my demo I find that there is no antialiasing. Any solutions? 回答1: role you own? There's lots of ways to anti-alias. Here's one. First check that you're not already anti-aliased var gl = someCanvas.getContext("webgl"); var contextAttribs = gl.getContextAttributes(); if (!contextAttribs.antialias) { // do your own anti-aliasing } The simplest way would be to make your canvas's backing store larger than it's displayed.

问题 Safari on iOS 8 supporting webgl is surely a good news but after I run my demo I find that there is no antialiasing. Any solutions? 回答1: role you own? There's lots of ways to anti-alias. Here's one. First check that you're not already anti-aliased var gl = someCanvas.getContext("webgl"); var contextAttribs = gl.getContextAttributes(); if (!contextAttribs.antialias) { // do your own anti-aliasing } The simplest way would be to make your canvas's backing store larger than it's displayed.

问题 I'm attempting to use the Three.js r.58 normal shader to make a displacement map. I have it displacing correctly, but the lighting doesn't seem to be respecting the post-displacement normals, even when I use computeTangents(). When I turn off the displacement, I see that the default normals are definitely funny. Here's a top view of a sphere, lit from the side (the white dot marks a pointLight): And here's a demo page: http://meetar.github.io/three.js-normal-map-0/index0.html What's causing

问题 I am using Firefox to render a 3D object in a canvas using WebGL. My code was working previously, whereby a textured object was being displayed within the canvas. However upon revisiting my code, without making any changes, the object will not render and the browser console displays the following error: Error: WebGL: drawArrays: no VBO bound to enabled vertex attrib index 1! It is complaining about a line in my drawScene() function, shown below: function drawScene() { gl.viewport(0, 0, gl

问题 I'm working to port a native OpenGL application to WebGL by using the three.js framework. I'm stumbling on the implementation of spherical impostors. Spherical Impostors are basically quads (or two triangles) that are rendered in a way that they always face the camera (much alike billboards). By employing custom vertex and fragment shaders, for every point on the rendered quad, a new position and normal are generated in a way that emulates a sphere. For a more detailed description you can

问题 I loaded an object with OBJLoader. I want to use a Shader Material with a texture. I pass my texture to the uniforms parameters of the material. I pass the UV variable from the vertex shader to the fragment shader. But when I use the uv coordinate for mapping my texture I get always 0,0 or at least this is what it looks like. The whole object is coloured with the bottom left pixel of the texture. Here are my shaders: <script type='x-shader/x-vertex' id='vertex-shader'> uniform float u_time;

问题 I loaded an object with OBJLoader. I want to use a Shader Material with a texture. I pass my texture to the uniforms parameters of the material. I pass the UV variable from the vertex shader to the fragment shader. But when I use the uv coordinate for mapping my texture I get always 0,0 or at least this is what it looks like. The whole object is coloured with the bottom left pixel of the texture. Here are my shaders: <script type='x-shader/x-vertex' id='vertex-shader'> uniform float u_time;

问题 I need to select Collada objects in Three.JS by mouse click. I know that I can select object based on their id and I saw some samples that user can interact with Geometry defined objects (here). But I need to have access to the objects in Collada format. 回答1: Assuming that dae_scene is a COLLADA scene returned from the ColladaLoader, here's what you can do to check for intersection: var toIntersect = []; THREE.SceneUtils.traverseHierarchy(dae_scene, function (child) { if (child instanceof

问题 I am rendering a texture using WebGL ,However ,the way I am rendering is I am rendering few lines of data and then moving those lines to right and again drawing another set of lines. For example : I have a image of 640*480 ,which contains 640*480*4 pixels of RGBA, however I am only filling the alpha values and it is a GrayScale medical Dicom image. Now ,the issue that I am facing is it is rendering the texture with jerks ,the image rendering is not happening smoothly. For example, This is