Loading object of vertices into buffer geometry

hello i have an object containing the vertices which is an array in the format(x,y,z) and also the faces which is an array also in the format (vertexIndex, textureCoordsIndex, vertexNormalIndex)
My problem is i want to use the attribute to load the 3D object using buffer geometry please how can i do thatfaces example
vertices example

If you want to retain the index data, try something like this:

const index = [];
const position = [];

for ( let i = 0; i < faces.length; i ++ ) {

    const face = faces[ i ];
    const faceIndices = face.vertices;

    indices.push( faceIndices[ 0 ].vertexIndex );
    indices.push( faceIndices[ 1 ].vertexIndex );
    indices.push( faceIndices[ 2 ].vertexIndex );

}

for ( let i = 0; i < vertices.length; i ++ ) {

    const vertex = vertices[ i ];
    position.push( vertex.x, vertex.y, vertex.z );

}

const geometry = new THREE.BufferGeometry();
geometry.setIndex( index );
geometry.setAttribute( 'position', new THREE.Float32BufferAttribute( position, 3 ) );

Thank you I will try this out

I tried this code piece out but it’s not displaying the 3d object :pensive:.

Then please demonstrate what you are doing with a live example: https://jsfiddle.net/vy29n6aj/

i have edited the fiddle and this is the new link https://jsfiddle.net/1fsw8g3m but i am fetching my data from a local api i created , is there anyway i can fake my data in the fiddle or maybe a way i can fetch the data from my local api but for now the link i provided just shows what i have implemented so far

Hello I did not hear from again…please help me running out of time

can you just print the data in console then hard code em in jsfiddle as a array?

:astonished: the data we talking about here is large … each objects in the array could contain more than 3000 items.
Even if am to hardcode it … can I at least shorten the data ?

As long as you are able to confirm the result base on what you provide.

I noticed a mistake sir…maybe before I hardcode the data I would love us to discuss it
The image attached below is an example of how the data comes from d api … all along I was making a mistake by using only the first index of array[0] of the data
But from a blog I read the format in which the data below is formatted is called grouping so am asking now if there is way I can display the below geometry since they are grouped

I noticed a mistake sir…maybe before I hardcode the data I would love us to discuss it
The image attached below is an example of how the data comes from d api … all along I was making a mistake by using only the first index of array[0] of the data
But from a blog I read the format in which the data below is formatted is called grouping so am asking now if there is way I can display the below geometry since they are grouped

Maybe you just simply add the group to the scene(THREE got its own group which can be added to scene directly)?Could you upload a live demo with annotations and assets to github so we may look into it?