rendering to canvas id

[Design Build Play]

How would I go about rendering to a stage that is defined on the html page, as in the <canvas> tag or id within other elements on the page.

 

The examples render directly to the HTML page and not to s specified id area

 

 

 

[Ezelia]

what Pixi do is just creating the canvas object for you.

if you want to use your own canvas you need to specify the canvas element while creating pixi renderer.

suppose you have this canvas in your html document

 

<canvas id="myCanvas"  width="400" height="400"></canvas> 

 

you can tell Pixi to use it by calling

 

 

var myView = document.getElementById('myCanvas');var renderer = PIXI.autoDetectRenderer(400, 400, myView); 

instead of
 

 

var renderer = PIXI.autoDetectRenderer(400, 400); 

 

 

[soylomass]

Edit: Wrong thread

[KanikaMehra]

Hi I tried using  but not much of a success.

 

I am trying to create an html input box so that i can take user inputs as pixi.js doesn't provide one!

So i tried to create a canvas along withy pixi app but the canvas shifts the rest of the view of the app:

 

which was earlier something like this:

Please help!

[ivan.popelyshev]

@KanikaMehra 

That's thread of 2013 year and very old pixiJS version.

If you searched some more time you could stumble across modern PixiJS docs: http://pixijs.download/dev/docs/PIXI.Renderer.html and "view" parameter. 

Please, before you do that again, read the docs and wiki: https://github.com/pixijs/pixi.js/wiki, and next time specify PixiJS version that you are using, and don't bump 5 year old threads.