Как выяснить ограничивающую рамку вращаемой трапеции, используя вращение

Question

Я пытаюсь соединить два прямоугольных объекта, которые обрезаны по одному углу.После этой операции они практически становятся трапециевидными.

Один объект поворачивается на определенное количество градусов, которое может варьироваться в зависимости от того, что вводит пользователь.Мне удалось вычислить угол, который должен иметь второй объект, чтобы он совпал с разрезом стороны основного объекта.

Проблема в том, что между объектами все еще есть зазор.Я думаю, что лучше всего рассчитать ограничивающий прямоугольник, поэтому я знаю, сколько мне нужно, чтобы отрегулировать положение в направлении x, y или z.

Я понятия не имею, как я могу рассчитать ограничивающий прямоугольник этой трапециихотя.Я искал переполнение интернета / стека, но не нашел ничего, что соответствовало бы моим потребностям.

У меня есть информация о размерах трапеций и угле поворота.

Вотрисунок, который, надеюсь, сделает мой случай немного более понятным:

Answer 1

Просто представление о том, как вы можете работать с THREE.Box3():

var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 1, 1000);
camera.position.set(5, 8, 13);
var renderer = new THREE.WebGLRenderer({
  antialias: true
});
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

var controls = new THREE.OrbitControls(camera, renderer.domElement);

scene.add(new THREE.GridHelper(10, 10, 0x404040, 0x202020));

//trapezoid
var tPoints = [
  new THREE.Vector2(0, 1),
  new THREE.Vector2(1, 0),
  new THREE.Vector2(5, 0),
  new THREE.Vector2(5, 1)
];

var tGeom = new THREE.ExtrudeGeometry(new THREE.Shape(tPoints), {
  depth: 1,
  bevelEnabled: false
});
tGeom.center();
var tMat = new THREE.MeshBasicMaterial({
  color: "aqua",
  wireframe: true
});
var trapezoid = new THREE.Mesh(tGeom, tMat);
trapezoid.position.set(0, 2.5, 0);
scene.add(trapezoid);

var box3 = new THREE.Box3();
var box3Helper = new THREE.Box3Helper(box3);
scene.add(box3Helper);

renderer.setAnimationLoop(() => {
  trapezoid.rotation.z += 0.01;
  box3.setFromObject(trapezoid);
  renderer.render(scene, camera)
});

body {
  overflow: hidden;
  margin: 0;
}

<script src="https://threejs.org/build/three.min.js"></script>
<script src="https://threejs.org/examples/js/controls/OrbitControls.js"></script>