createjs html5 캔버스 통합이 작동하지 않음

Question

w3school html5 캔버스를 플래시 내보내기 createjs와 통합하려고 시도했습니다. 이 코드를 createjs 출력에 추가했습니다.

var ctx = canvas.getContext("2d"); 
    ctx.fillStyle = "#FF0000"; 
    ctx.fillRect(0,0,150,75); 

그러나 오류를 나타내지 않았다. .......... 샘플에서

<script> 
var canvas, stage, exportRoot; 

function init() { 
    canvas = document.getElementById("canvas"); 
    exportRoot = new lib.Untitled1(); 

var canvas = document.getElementById("myCanvas"); 

var ctx = canvas.getContext("2d"); 
ctx.fillStyle = "#FF0000"; 
ctx.fillRect(0,0,150,75); 

stage = new createjs.Stage(canvas); 
stage.addChild(exportRoot); 
stage.update(); 
    createjs.Ticker.setFPS(24); 
    createjs.Ticker.addEventListener("tick", stage); 
} 
</script> 

Answer 1

작동하지 않습니다, 당신은 캔버스 컨텍스트에 내용을 그리기하고 같은 컨텍스트를 사용하는 EaselJS 단계를 업데이트하고 있습니다. EaselJS는 기본적으로 그리기 전에 컨텍스트를 지 웁니다. 자동 초기화를 끌 수 있지만 다른 문제가 발생할 수 있습니다.

더 좋은 해결책은 EaselJS를 사용하여 다른 콘텐츠를 그리는 것입니다.

// Create your red square 
var shape = new createjs.Shape(); 
shape.graphics.beginFill("#FF0000").drawRect(0,0,150,75); 

// Create the stage and add the exportRoot 
stage = new createjs.Stage(canvas); 
stage.addChild(exportRoot); 

// Add your shape to the stage 
stage.addChild(shape); 

// Then the rest... 
stage.update(); 
createjs.Ticker.setFPS(24); 
createjs.Ticker.addEventListener("tick", stage); 

당신이 자신의 상황에 맞는 작업을 사용할 필요가, 별도의 캔버스에 그릴 수 있다면 의미가 비트 맵

var canvas = document.getElementById("myCanvas"); 
var ctx = canvas.getContext("2d"); 
ctx.fillStyle = "#FF0000"; 
ctx.fillRect(0,0,150,75); 
var bitmap = new createjs.Bitmap(canvas); 

stage = new createjs.Stage("otherCanvasId"); 
stage.addChild(exportRoot); 
stage.addChild(bitmap); 
// Other stuff here 

희망의 소스로 그 캔버스를 사용!