Playing around with canvasZone

I’m trying to implement something like https://playground.babylonjs.com/#CUH660#3 but unfortunately, it says that document.getElementById(‘canvasZone’); returns null.

I noticed that playground uses
<div id="canvasZone"> <canvas touch-action="none" id="renderCanvas"></canvas> </div>
instead the
<canvas id="renderCanvas"></canvas>
that you find when you download the sample

But adding that div moves my viewport and it gets resized in half vertical size.

any idea on this? Thank you in advance.

Forget about that
#canvasZone { width: 100%; height: 100%;}

does the work , I won’t delete the post since it could be helpful for someone in the future.

2 Likes