question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

BufferGeometry: Add support for interleaved data in computeVertexNormals().

See original GitHub issue

this 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:closed
  • Created 4 years ago
  • Comments:10 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
WestLangleycommented, Mar 4, 2021

Exactly. So our work is done. 😃

1reaction
Mugen87commented, Jan 30, 2021

But honestly, if you are using interleaved arrays, you may want your normals to be interleaved as well.

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 new InterleavedBuffer from scratch as well as new InterleavedBufferAttributes.

@mrdoob Should we support this?^^

Read more comments on GitHub >

github_iconTop 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 >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found