In the scope of an academic project, I attempt to build a graph visualization tool using the Three.js library.
In order to improve the speed of the graph processing, I have to go through shaders to optimize as possible the rendering of big graphs.
I followed the example for the .addAttribute use in BufferGeometry. Basically, I added two different attributesoriginX and originY, and as a value, I set new THREE.BufferAttribute (originToBufferX, 0) where originToBufferX is a Typed array Float32Array of size 1, and include the intended value to transport.
This is how the part looks like:
Notice: I used here THREE.BufferGeometry as geometry.
*While I set 0 as a parameter for the ItemSize of a THREE.BufferAttribute I would get at least a rendering in my visualization, but not as intended. And my console would point to the following shader error:
GL ERROR :GL_INVALID_VALUE : glVertexAttribPointer: size GL_INVALID_VALUE
*If I set 1 as a parameter for the ItemSize of a THREE.BufferAttribute ( and what here would be more logic since I’m transporting a value of 1 item), I would not have any rendering and I would get the following error: glDrawArrays: attempt to access out of range vertices in attribute 0
For my shader code, I just wrote some simple statement just to test the outcome:
Someone can help me with that issue. I’ve been working on it since days but I couldn’t reach any significant result.