С помощью каких вычислений можно удерживать один прямоугольник (назовем его
target) в границах другого (назовем его
targetBounds)?
Оба прямоугольника находятся в одной системе координат.
Прямоугольники могут иметь разную ширину и высоту, но угол всегда один.
Target может перемещаться и масштабироваться, но не должен выходит за границы
targetBounds
Если угол равен 0 то я без проблем могу зафиксировать
target в границах
targetBounds
К примеру если при перемещении
target, его x или y меньше чем у
targetBounds, то
target я задаю x/y как у
targetBounds. Когда угол равен 0 - все просто.
Но когда объекты имеют угол < 0 или > 0, то я не могу зафиксировать
target в границах
targetBounds
Я создал песочницу с примером:
https://codesandbox.io/s/k970vyv415
При двойном клике на изображение, создается красный прямоугольник и накладывается на изображение. Его можно масштабировать и перемещать. Если у картинки угол равен 0 то красный прямоугольник не выходит за границы картинки, но если картинку сначала повернуть, а потом открыть кроп, то проверки уже не правильно работают, это видно, когда перемещаешь красный прямоугольник.
Пример в песочнице на vuejs + fabricjs, но весь код, который отвечает за эту задачу находится в src/canvas/addons/crop и там только javascript (конечно вместе с fabricjs, но там конечно не сложно и интуитивно понятно)
