BufferGeometry: Add support for interleaved data in computeVertexNormals().
See original GitHub issuethis code:
vA = indices[ i + 0 ] * 3;
vB = indices[ i + 1 ] * 3;
vC = indices[ i + 2 ] * 3;
and corresponding un-indexed code:
pA.fromArray( positions, i );
pB.fromArray( positions, i + 3 );
pC.fromArray( positions, i + 6 );
fails to take into account the property stride.
repro steps look a bit like this:
const meshData = (...)
var geometry = new BufferGeometry();
var arrayBufferFloat = new Float32Array(meshData.vertices);
var arrayBufferByte = new Uint8Array(arrayBufferFloat.buffer); // alias this buffer, but with U8
const buffer32 = new InterleavedBuffer(arrayBufferFloat, meshData.vertexStride);
const buffer8 = new InterleavedBuffer(arrayBufferByte, meshData.vertexStride * 4);
geometry.setAttribute(
'position',
new InterleavedBufferAttribute(buffer32, 3, 0));
geometry.setAttribute(
'color',
new InterleavedBufferAttribute(buffer8, 4, meshData.colorOffset * 4, true));
geometry.setIndex(new BufferAttribute(new Uint32Array(meshData.faces), 1));
geometry.computeVertexNormals();
The “https://threejs.org/examples/#webgl_buffergeometry_points_interleaved” example would reproduce this if it was modified to draw triangles instead of particles.
Issue Analytics
- State:
- Created 4 years ago
- Comments:10 (2 by maintainers)
Top Results From Across the Web
BufferGeometry#computeVertexNormals – three.js docs
A representation of mesh, line, or point geometry. Includes vertex positions, face indices, normals, colors, UVs, and custom attributes within buffers, reducing ...
Read more >Compute Vertex Normals for Buffer Geometry in threejs
VertexNormalsHelper that can be added to an example by way of one additional javaScript file that can be found in the threejs repository....
Read more >three BufferGeometry TypeScript Examples - ProgramCreek.com
This page shows TypeScript code examples of three BufferGeometry. ... geometry.attributes.position as InterleavedBufferAttribute; const data = attr.data; ...
Read more >three.js buffer is already interleaved - javascript - Stack Overflow
Your offset for the 2nd attribute is not correct. // Use vertexBuffer, starting at offset 0, 3 items in position attribute var positions ......
Read more >Three.js Custom BufferGeometry
Togther, the added BufferAttribute s represent parallel arrays of all the data for each vertex. Above you can see we have 4 attributes:...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Exactly. So our work is done. 😃
The primary purpose of using interleaving vertex data is the better memory locality. Meaning it’s more likely to have cache hits on the pre-transform vertex cache of the GPU. So without interleaving, you will miss the main purpose of using instances of
InterleavedBufferAttribute
.The complexity of
BufferGeometry.computeVertexNormals()
will be much bigger if the engine should support this use case since you have to generate a newInterleavedBuffer
from scratch as well as newInterleavedBufferAttribute
s.@mrdoob Should we support this?^^