How to project a 3D cuboid onto a 2D camera image using SVG?

I’m working on a project where I need to render a 3D cuboid onto a 2D camera image using SVG. The image should be displayed with a width of 600px, maintaining its aspect ratio. Here are the details of my cuboid and camera calibration:

const cuboidData = {
    "id": "c90193ab-1812-4b52-a853-030d44a901fd",
    "objType": "3D_BOX",
    "viewIndex": 0,
    "center3D": { "x": 23.708989938369655, "y": -4.249143642992031, "z": 0 },
    "rotation3D": { "x": 0, "y": 0, "z": -1.5707965497209813 },
    "size3D": { "x": 2.0937808419650805, "y": 2.832762406310554, "z": 0.2 }
};

const cameraCalibration = {
    "camera_matrix": [7265.09513308939, 0.0, 2099.699693520321, 0.0, 0.0, 7265.09513308939, 1217.709330768128, 0.0, 0.0, 0.0, 1.0, 0.0],
    "distortion_coeffs": [-0.0878118, 0.0196239, 0.0, 0.0, 0.902557],
    "width_px": 4112,
    "height_px": 2504
};

const coordSystem = {
    "translation": [0.0609096, -0.136682, 3.51522],
    "quaternion": [-0.0121052, 0.0606543, 0.188524, 0.980119]
};

How can I correctly handle the camera calibration and transformations to render the 3D cuboid accurately on the 2D image using SVG?