RaphaelJS вращение не работает - PullRequest
5 голосов
/ 27 октября 2011

Я бьюсь головой об стену с этим. У меня есть Raphael JS версии 2.0, и мне нужно, чтобы изображения вращались в кросс-браузерном режиме. Я хотел бы сделать это в CSS3, но не все браузеры поддерживают то, что мне нужно.

итак, взломав свой мозг, я пошел на площадку Рафаэля и там попробовал какой-то код. Там тоже не работает. Что здесь происходит?

перейти на игровую площадку: http://raphaeljs.com/playground.html запустить этот код, должен увидеть контур квадрата. paper.rect (100, 100, 300,300) .animate ({вращение: "- 45"}, 2000);

с использованием работ преобразования:

paper.rect (100, 100, 300,300) .animate ({transform: "r45"}, 2000);

но, к сожалению, с преобразованием я не могу указать центральную точку. Я хочу, чтобы объект вращался от левого нижнего угла. Я могу сделать это с помощью этого кода:

paper.rect (100, 100, 300,300). Rotate (45,0300)

но это не оживляет, не принимает послабления и не имеет обратных вызовов.

Я видел «вращение» в нескольких примерах, включая следующие:

http://www.irunmywebsite.com/raphael/additionalhelp.php#PAGETOP http://net.tutsplus.com/tutorials/javascript-ajax/an-introduction-to-the-raphael-js-library/

спасибо, - Кит

Ответы [ 2 ]

11 голосов
/ 27 октября 2011

Переход на игровую площадку и вставка этого кода:

paper.rect(100, 100, 300,300).animate({transform:"r-45,0,0"}, 2000);

вращает прямоугольник от абсолютной позиции 0,0. См. Raphael JS код @ github , который показывает, что transform может принимать 2 или 4 параметра для достижения поворота.

3 голосов
/ 27 октября 2011

Атрибут поворота отсутствует в спецификации 2.0. Он существовал в 1.x. Я не знаю, почему это так, но я не могу найти это в новой документации. Я ожидаю, что это упущение, которое будет исправлено в незначительном пересмотре в будущем.

Тем временем вы можете создать свой собственный обработчик анимации и вызывать .rotate для каждого тика, основываясь на собственном смягчении.

...