Привязывайте края объектов друг к другу и предотвращайте наложение

Моя цель состоит в том, чтобы предотвратить наложение двух или более прямоугольников внутри моего полотна FabricJS.

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

Если прямоугольник A подходит достаточно близко к прямоугольнику B, положение прямоугольника A должно привязываться к краю прямоугольника B. Это должно работать для любого края прямоугольника B. Вершины не должны совпадать, потому что размеры прямоугольников являются переменными ,

У меня есть рабочий пример для привязки к одному измерению (оси X).

Моя лучшая попытка jsfiddle

Увидетьjsfiddle.

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

Фрагменты кода, которые могут помочь:

object.oCoords.tl.x //top-left corner x position. similar goes for top-right (tr), bottom-left (bl), bottom-right (br) and .y for y-position
mouse_pos = canvas.getPointer(e.e);
mouse_pos.x //pointer x.position
mouse_pos.y //pointer y.position
object.intersectsWithObject(targ) // object = dragged rectangle, targ = targeted rectangle

Привязка должна работать для неограниченного количества объектов (не только для двух прямоугольников).

Ответы на вопрос(3)

Ваш ответ на вопрос