How to copy Webgl content to another canvas element without create new Pixi.application

Hi all,

How to do the result like pure html canvas for redraw canvasA’s content to canvasB.

Here is the result i wished:

var canvasA = document.getElementById("canvasA");
var ctxA = canvasA.getContext("2d");
//ctxA drawsomthing......
...
...

var canvasB = document.getElementById("canvasB");
var ctxB = canvasB.getContext("2d");

ctxB.drawImage(canvasA, 0, 0, canvasB.width, canvasB.height);

How to do it in Pixi.jsV4 By the way, my renderer is ‘Webgl context’

Thanks a lot!

[vicchoutw]

Really helpful, thanks

[ivanpopelyshev]

Application is a mashup: https://github.com/pixijs/pixi.js/blob/dev/src/core/Application.js , it has Renderer, ticker and stage inside.

Juts make two renderers instead of one and render the same stage.

var renderer1 = new PIXI.WebGLRenderer(100, 100, { view : ... } );
var renderer2 = new PIXI.WebGLRenderer(100, 100, { view : ... } );
var stage = new PIXI.Container();

function RAF() {
    renderer1.render(stage);
    renderer2.render(stage);
    requestAnimationFrame(RAF);
}

requestAnimationFrame(RAF);

You can customize some params, like transform applied to stage, if you look at render documentation