Take Screenshot of Engine with canvas not appended to page

I am trying to take a screenshot of a scene and engine that were created in the background and manually updated when required.

It seems like though it always comes back as black. Here is a simplified PG:
https://www.babylonjs-playground.com/#UP3MIP

the imageURI gets posted in the console.

I’m sure there is a simple fix for this.

let scene = new BABYLON.Scene(this.engine) => let scene = new BABYLON.Scene(subEngine)

huh?

Sorry I don’t get it.

whoops gotcha!

Line 48, you have:

let scene = new BABYLON.Scene(this.engine)

It should be:

let scene = new BABYLON.Scene(subEngine)

1 Like

Looks like that was the problem on my local as well… I forgot to change which engine I was pointing to.

https://www.babylonjs-playground.com/#UP3MIP#1

Thank you sir!

Ok now to extend this to the next level, sorry to keep bugging you but I can’t get my real world example to work.

Drag a .babylon file to the canvas
https://www.babylonjs-playground.com/#U2U5LA#17

@Evgeni_Popov
I can’t seem to get the assets appended from the container to the screenshot. I think it might be because I am manually changing the scene on the asset container. But when I look at the contents of that scene afterwards the assets are present. So I am kinda confused.

I’m not sure you can move the assets from one scene to another…

Why not passing directly sub.subScene to LoadAssetContainer:

https://www.babylonjs-playground.com/#U2U5LA#20

That’s still not letting me grab a screenshot of the dropped bjs scene. hmmm…

That’s because the camera defined in the sub scene may not see any mesh in your dropped scene, as it is in a fixed position / orientation, and the meshes of your dropped scene could well be behind it…

https://www.babylonjs-playground.com/#WYUA3S#2

This PG uses the first camera defined in the loaded asset if it exists: try to drop the candle.babylon scene.

I have changed the position of the default camera (line 72): try to drop skull.babylon, you will see the skull is rendered even if no cameras are defined in the skull.babylon scene.

Also, you should wait for all assets of the scene to be ready before taking the screenshot, else you may end up with an empty picture: I used the scene.executeWhenReady function for that.

1 Like

the executeWhenReady did the trick.