회전 된 이미지를 easeljs로 저장 하시겠습니까?

Question

easeljs를 사용하여 캔버스에 비트 맵 이미지를로드하고 있습니다. 로테이션을 적용 할 수 있으며 해당 이미지에 대한 수정 된 dataUrl을 가져 와서 로테이션을 표시하고 싶습니다. 그러나 cache 또는 getCacheDataURL을 사용할 때 순환 게재가 무시되는 것 같습니다.

샘플 코드 - jsfiddle here

var stage = new createjs.Stage("canvas"); 

// Create an image. 
var image = new Image(); 
// Since this sample is cross-domain, we must set this flag. 
// Note that the origin server supports CORS. 
image.crossOrigin = "Anonymous"; 
image.onload = createImage; 
image.src = "http://playpen.createjs.com/CORS/duck.png"; 

// rotate the image 
bmp.rotation = 45; 

stage.addChild(bmp); 

function createImage() { 

    // Update the stage once to show the loaded image (at its native size) 
    stage.update(); 

    // Cache the bitmap. This is necessary to create the cache-canvas. 
    bmp.cache(0,0,image.width,image.height); 

    // Note that if you update again, it will show the canvas image as blurred. 
    //stage.update(); 

    // Get the cache-canvas's data url. 
    var url = bmp.getCacheDataURL(); 

    // Create a new image with the data url, and add it to the body. 
    var img2 = new Image(); 
    img2.src = url; 
    document.body.appendChild(img2); 
} 

Answer 1

영상은 부모의 문맥으로 회전한다. 소스를 회전해도 소스의 방향이 바뀌지 않습니다.

다음은 빠른 업데이트로, 비트 맵이 컨테이너에 추가되고 컨테이너가 bmp 대신 캐시됩니다. bmp가 컨테이너 내부에서 회전하기 때문에 예상대로 나타납니다.

http://jsfiddle.net/ecwd5vdz/2/

var cont = new createjs.Container(); 
cont.addChild(bmp); 
// 
cont.cache(0,0,image.width,image.height); 

희망하는 데 도움이.