Повернуть квадрат с помощью мыши

Я пытаюсь сделать что-то подобное, но мне нужны некоторые модификации, которые я не знаю, как это сделать.

Пример: http://demo.superdit.com/jquery_image_rotate/

Но в этом примере у меня есть некоторые проблемы. После поворота на 360º кажется, что он сходит с ума... вероятно, математика кода... и мне нужно повернуть изображение, на которое я нажимаю, не только по центру... но и в любом месте изображения, на которое я нажимаю и перетащите, он вращается вокруг своей оси.

У кого-нибудь есть идеи, как изменить этот код? Спасибо!

пс: извините за мой английский


javascript jquery drag rotation mouse
person efdutra    schedule 27.01.2012    source источник
comment
Пожалуйста, опубликуйте свой код. Было бы отлично, если бы вы могли также портировать функциональность на jsfiddle, чтобы другие могли манипулировать ею по своему желанию.   -  person cheeken    schedule 28.01.2012
comment
Возможно, вы захотите проверить эту ссылку: stackoverflow.com/questions/7873470/. Использует холст.   -  person j08691    schedule 28.01.2012

Ответы (2)


arrow_upward
0
arrow_downward

Вы можете использовать Raphaël, он поддерживает такие вещи, как рисование, перетаскивание и поворот изображений.

Простой пример рисования и перетаскивания изображения: http://jsfiddle.net/8j8HP/1/

Простой пример поворота изображения, где центр вращения не является центром изображения: http://jsfiddle.net/wXctQ/

Теперь вам просто нужно рассчитать угол от положения мыши до центра вращения.

person Robar    schedule 27.01.2012

arrow_upward
-1
arrow_downward

Попробуйте пропеллер.js, это библиотека для поворота HTML-элементов мышью или касанием https://github.com/PixelsCommander/Propeller

person PixelCommander    schedule 04.02.2014