центрирование js тригонометрии после вращения - PullRequest
2 голосов
/ 01 ноября 2011

Here's the scenario

О боги JavaScript!Один для тех, кто все еще помнит тригонометрию из школы; -)

См. Ссылку ниже, я, по сути, пытаюсь центрировать некоторый контент, однако нормальное уравнение типа screenwidth-divwidth / 2 не работает из-за углов.

только в Firefox прямо сейчас http://jsbin.com/uruvub/2/

Большое спасибо!

1 Ответ

2 голосов
/ 01 ноября 2011

Сначала представьте «красную систему координат», прикрепленную к верхнему левому углу вашего красного прямоугольника, с красной осью Y, заданной верхней границей красного прямоугольника и идущей вправо, и красной осью Y, заданной левой границейкрасной коробки и идет вниз.Смещение (d_x, d_y) серого прямоугольника в этой красной системе координат:

d_x = (W - w) / 2,   W = width of red box, w = width of grey box
d_y = (H - h) / 2,   H = height of red box, h = height of grey box

Тот же вектор смещения (d_x, d_y) действителен для верхнего правого угла зеленого прямоугольника.

Теперь нам нужно выразить этот вектор (d_x, d_y) в «черной системе координат», заданной вашей осью X и осью Y.Системная система красного цвета может быть преобразована в черную систему путем поворота на угол a (заданный вами угол) и смещения начала координат.Вращенный вектор равен

D_x = d_x * cos(a) - d_y * sin(a)
D_y = d_x * sin(a) + d_y * cos(a)

Это смещение в черной системе относительно левого верхнего угла красной рамки, выраженное в черной системе.

Примечание: Возможно, вам нужноизмените a на -a в приведенной выше формуле в зависимости от смысла вращения.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...