Need Help with Creating a Frame with Mitered Corners in [login to view URL]

Hello everyone,

I'm currently working on a project in [login to view URL] where I need to create a rectangular frame with mitered corners, similar to a picture frame or window frame. However, I'm facing challenges in accurately aligning and positioning the beams at mitered angles to form a perfect square or rectangular frame.

So far, I've been able to create individual beams with mitered cuts using matrix transformations, but aligning them to form a cohesive frame has been problematic. Here's a brief overview of what I've tried:

Using BoxGeometry to create individual beam geometries.

Applying a shear matrix for the mitered cuts.

Attempting to position and orient each beam so that the mitered edges align accurately at the corners of the frame.

I'm looking for advice or examples on how to correctly position and align these beams. If anyone has experience with this kind of geometric manipulation in [login to view URL] or knows of any resources, tutorials, or example codes that could guide me in the right direction, it would be greatly appreciated.

[login to view URL]

JavaScript Dthreejs Three.js

Project ID: #37499318

About the project