Raphaël을 사용하여 일반 이미지를 회전하는 방법은 무엇입니까?

Question

이것은 매우 사소한 질문 일 수도 있고 아닐 수도 있지만 다시 한번 저는이 자바 스크립트 라이브러리에 대해 완전히 새로운 것입니다. Raphaël을 사용하여 내 서버에서 간단한 이미지 (png/jpeg 등)를 회전하는 방법은 무엇입니까? 먼저 SVG로 변환해야합니까? 즉, this demo을 복제해야합니다. http://raphaeljs.com

Answer 1

이미지를 캔버스에 놓고 회전 변환을 적용합니다. 다음은 그 예입니다.

var paper = Raphael("thepaper", 300, 300); 
var theImage = paper.image("http://i.stack.imgur.com/Zg08b.png", 0, 0, 128, 128); 
theImage.transform("R45"); 

here의 작동 데모를 볼 수 있습니다.

animation을 적용하면 매우 쉽게 애니메이션을 적용 할 수 있습니다. 여기에 마지막 줄을 변경 :

theImage.animate({"transform": "R45"}, 10000); 

당신은 볼 수 here 작업, 그리고 그 10 초 동안 그것을 45도 회전합니다.