Display Three.js scene in Ionic

Hello! I can’t get this Three.js scene to appear inside a blank page of Ionic 6, could you help me out? I copied and pasted the code I found here and in the live example but all i see is a black screen.

How to use Three.js with Ionic? Is there a reccomended way?

Thanks for the answer! It will be very useful to many people. :grinning:
Last question: how can I display the scene directly when i enter the page, without clicking the button?

edit: solved adding: ngOnInit(){ this.stuff() ; }

1 Like

Maybe better use ionViewDidEnter or any other hook where u can be sure the view is initialised

1 Like

Real last questionS
You wrote “this.container = document.getElementById(‘canvas’); // should actually be done using ViewChild” could you explain me better, please?

Using ionViewDidEnter i noticed a little bit of delay for the scene to initialize while with ngOnInit not, why?

Plse read this on ngOnit and the other lifectcle hooks you can use and when they fire

ViewChild is the angular way to address a DOM element. You can google this. But if you dont use it, you might run into issues soon.