Search the Community

Trying to think through how to dynamically resizing pixi stage on window resize. I'm using the following the set the size of my stage to the window, it works fine (though it distorts the images, does not keep ratio). stageWidth = $(window).innerWidth(); stageHeight = $(window).innerHeight();console.log(stageWidth, stageHeight); // create an new instance of a pixi stage var stage = new PIXI.Stage(0xff00ff); var renderer = PIXI.autoDetectRenderer(stageWidth, stageHeight);But how do I extend this to update the stage size when the browser window is resized? I tried the following (with a call to onResize inside my animate function) - it may be resizing the stage (i'm not sure), but it's not resizing the content - and I'm getting a warning in the console (WARNING: Too many active WebGL contexts. Oldest context will be lost): function onResize(){ $( window ).resize(function(){ stageWidth = $(window).innerWidth(); stageHeight = $(window).innerHeight(); renderer = PIXI.autoDetectRenderer(stageWidth, stageHeight); }) } Maybe I need to be updating the ' document.body.appendChild(renderer.view); ' instead? How would I do that, if in fact that's what I need to do?