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.