asakasinsky
@asakasinsky

Как рассчитать координаты для translate(x, y) относительно системы координат вьюпорта а не системы координат объекта?

Как рассчитать координаты для translate(x, y) относительно системы координат вьюпорта а не системы координат объекта?
Вот этот комментарий отлично описывает проблему:
Самую интересную и неочевидную особенность трансформаций не отразили: то, что трансформация меняет именно систему координат объекта. Например, если объект повернуть на 90° по часовой, раскукожить вдвое и после этого попытаться сдвинуть на 100px вправо — на самом деле он сдвинется на 200px вниз, т.к. в его системе координат теперь ось X смотрит вниз (а ось Y — влево) и каждый «пиксель» в ней равен двум настоящим.


Дополнение #1:
https://yadi.sk/d/9I5hJGWChXSZU
На гифке два элемента: первый с углом поворота 0deg, второй же повёрнут на 30deg. Нужно передвинуть элемент с помощью mouse или touch событий. Казалось бы чего проще, считывай координаты из событий и в соответствии с ними передвигай объект, но, как выяснилось, с помощью transform: translate(x, y) позиция элемента задаётся относительно его системы координат, а не вьюпорта.
  • Вопрос задан
  • 781 просмотр
Решения вопроса 1
Petroveg
@Petroveg
Миром правят маленькие с#@&ки
Я так и не понял, что вам конкретно нужно, но верным решением будет декомпозиция матрицы и изменение отдельных матриц трансформаций для последующего умножения и получения итоговой матрицы.

Сделал примитивный пример с matrix2d — таскаем трасформированные объекты.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
scapp
@scapp
JS фрилансер
Добавьте переменные с координатами вьюпорта и используйте как вам надо.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы