Downloaded video texture example not working due to console error?

Questions
1

Dear Community,

These dope playground examples with youtube video textures don’t work when I download it and run locally.

https://www.babylonjs-playground.com/#1LEGTP#4

and

https://playground.babylonjs.com/#AGY66J#14

The error is:
Uncaught TypeError: Cannot read property ‘offsetWidth’ of null

On this line:
let zone = document.getElementById(‘canvasZone’);

I google around and it might have to do with load order, but I don’t see anything that helps with the babylon context. Any ideas?

2

I run it locally with http-server

3

This is expected cause the code itself contains a few tricks directly using some of the playground dom elements which do not exist when downloaded locally.

4

Thank you @sebavan, is there documentation of said tricks or some way to understand how to do them?

5

In the downloaded code (index.html), simply replace:

    <canvas id="renderCanvas"></canvas>

by:

<div id="canvasZone">
    <canvas id="renderCanvas"></canvas>
</div>
2 Likes