I'm trying to figure out how to get the rect coords of a mesh for 2D projection.

I need X, Y, Width and Height.

After reading many SO posts and various blogs, it seems like none of them work with latest modern Three.JS and the documentation doesn't have a function for it.

How is this achieved?

Currently, I'm looking at using a Box3 and then project the Box3 to screen.

UPDATE My code looks like this

rect(mesh, camera, w, h){
        var bbox = new THREE.Box3().setFromObject(mesh);
        bbox.min.setFromMatrixPosition(mesh.matrixWorld);
        bbox.max.setFromMatrixPosition(mesh.matrixWorld);
        bbox = {
            min: bbox.min.project(camera),
            max: bbox.max.project(camera)
        }

        var to2D = which => {
            bbox[which] = {
                x: (bbox[which].x + 1) * w / 2,
                y: -(bbox[which].y - 1) * h / 2
            }
        }
        
        to2D('min')
        to2D('max')


        return {
            x: bbox.min.x,
            y: bbox.min.y,
            w: bbox.max.x - bbox.min.x,
            h: bbox.max.y - bbox.min.y
        }
    }

    return rect
}

The output is basically a single point with no rect width/height.