Поворот точки относительно координат изображения

Question

Я создаю базу данных для моих локальных фотографий с веб-интерфейсом, где я хочу иметь возможность помечать изображения и поворачивать их, среди прочего.При реализации тегов (так же, как система тегов Facebook) я столкнулся с проблемной областью.А именно:

Допустим, я пометил изображение (не) меня:

И когда я повернул его, я хочу повернуть координаты тегас изображением, вот так:

Вот моя проблема.Я сохраняю координаты в базе данных (x, y) в системе координат CSS, то есть left / top вместо математического left / bottom.(Возможно, это не слишком большая проблема?)

Следующая большая проблема заключается в том, что когда я вращаюсь вокруг центра (точка [0,0]), я получаю отрицательные координаты.Например, от [100, 100] до [-100, -100].Это не правильно, потому что когда я поворачиваю изображение, я не получаю отрицательных координат.Система координат является только положительной.

Весь мой код вращения использует формулу вращения вектора:

$nx = $x * cos(deg2rad($rotation_angle)) - $y * sin(deg2rad($rotation_angle));
$ny = $x * sin(deg2rad($rotation_angle)) + $y * cos(deg2rad($rotation_angle));

Мой вопрос: как мне решить эту проблему?Я пытался просто использовать abs, чтобы превратить отрицательные значения в положительные, но это приводит к неправильным координатам.

Answer 1

Если ваши повороты только с шагом 90 градусов, как показано здесь, то ответ довольно прост.Хитрость в том, что вы не вращаете сами координаты в пределах фиксированной системы координат, вы просто меняете систему координат, в которой они измеряются.(Что ж, оба эквивалентны, но мне кажется, что это проще для визуализации.)

В вашем оригинале вы x измерены справа от левого края и y измерены сверху внизкрай.После поворота края поменялись местами, поэтому вам нужно выяснить, где находится та же точка по отношению к этому новому кадру.Таким образом, new x - это расстояние вправо от new левого края, который раньше был нижним;а новый y - это расстояние вниз от нового верхнего края, которое раньше было левым.то есть:

$ny = $x;
$nx = $height - $y;

Расширение этого до поворотов на 180 и 270 градусов должно быть довольно очевидным.

Если вам нужно обработать частичные повороты, тогда проблема немного сложнее, потому что вы должныОпределите оси координат, которые выровнены по странице, а не по краям изображения, и у вас есть выбор, как их сместить.Если это так, прокомментируйте, и я постараюсь заполнить более подробную информацию (намного) позже.