I have a massive database containing tens of thousands of objects with various types of information, including their 3D meshes. Currently, I am attempting to display these objects in web browsers using Three.js.
The object information is provided by another source, so I can only access it as it is given to me. When querying the database, I receive data such as the following:
indices: [data here];
points: [data here];
Now, my challenge lies in integrating this data into the BufferGeometry of Three.js. Referring to the example at , it seems that I need to use the following snippet:
var triangles = 276;
var geometry = new THREE.BufferGeometry();
var indices = new Uint32Array(triangles * [number]);
But how do I go about inputting my indices string/array and points into the Buffer?
EDIT
Thanks to the suggestion from @mlkn, I was able to resolve my issue. Since my indices and vertices are sourced from a database, I modified the string on the server-side using PHP. This way, the client-side does not need to handle any loops. My code now appears as follows:
var vertices = new Float32Array([-155.751724243164,106.251846313477,-20000,...]);
var indices = new Uint16Array([0,1,2,3,0,2,4,5,2,...]);
var geometry = new THREE.BufferGeometry();
geometry.addAttribute( 'position', new THREE.BufferAttribute( vertices, 3 ) );
geometry.setIndex( new THREE.BufferAttribute( indices, 1 ) );
var material = new THREE.MeshBasicMaterial({color: 0xffbb0f});
var mesh = new THREE.Mesh( geometry, material );
scene.add(mesh);
This solution works perfectly!