Правильный способ вращать вещи с помощью мыши в Fabric.js

Вот пример:
http://jsbin.com/UHENoKi/11/

Здесь я использую простую формулу, чтобы найти угол между двумя точками (векторами):
введите здесь описание изображения

Но как вы могли видеть на JSBin — что-то сломалось. Где я сделал ошибку?

ОБНОВИТЬ

Рабочий пример:
http://jsbin.com/UHENoKi/13/edit?js,output


javascript canvas user-interface graphics fabricjs
person Gill Bates    schedule 09.11.2013    source источник
comment
Я думаю, что способ, которым вы рассчитываете, хорош для определенных квадрантов. Я думаю, вам нужно изменить значения (это просто пример, а не реальный), например + Qx * 90, где Q0 = 0, Q1 = 90 и т. д.   -  person Itay Moav -Malimovka    schedule 10.11.2013

Ответы (1)


arrow_upward
5
arrow_downward

Угол поворота рассчитывается на основе начала координат 0,0, но квадрат вращается вокруг собственного центра в точках 100, 100, поэтому они не совпадают. Если вы переместите квадрат на 0,0, все будет в порядке:

var rect = new fabric.Rect({
  fill: '#00FFAB', 
  top: 0, 
  left: 0, 
  width: 100, 
  height: 100, 
  selectable: false
});

Вместо того, чтобы переводить в координаты холста в toLocal, переводите в координатное пространство квадрата.

person Douglas    schedule 09.11.2013