Recommended Posts

Hello amazing people!

I'm using the following code to try to grab a screenshot of my scene and display it in an HTML <img> tag. It seems to be working because my <img> is the same size as my canvas (1280x800).

BABYLON.Tools.CreateScreenshot(engine, camera, {precision: 1}, data => {

  var test = document.createElement('img');
  test.src = data;
  document.body.appendChild(test);

})

However, the image is empty (only transparent pixels). Does anyone have an idea of what might be going on? Or something I could try in order to troubleshoot the issue?

Thanks.

Share this post


Link to post
Share on other sites

I've had better luck with CreateScreenshotUsingRenderTarget.  Try without the last 2 params I have added in this snippet, but 16 is samples.

BABYLON.Tools.CreateScreenshotUsingRenderTarget(
   engine,
   camera,
   { precision : 1 },
   (data) => {
       ... = data;
   },
   undefined,
   16
);

Here is the official docs:
https://doc.babylonjs.com/how_to/render_scene_on_a_png#createscreenshotusingrendertarget

The last few parameters aren't on the docs page, but can be found here:
https://github.com/BabylonJS/Babylon.js/blob/e5101a113cfbca77ed29e541d112ccb14f516573/src/Tools/babylon.tools.ts#L1017

Share this post


Link to post
Share on other sites

If same size as canvas, you can also just do canvas.toDataURL()

  var test = document.createElement('img');
  test.src = renderCanvas.toDataURL("image/png");
  document.body.appendChild(test);

 

Share this post


Link to post
Share on other sites
9 hours ago, brianzinn said:

I've had better luck with CreateScreenshotUsingRenderTarget.  Try without the last 2 params I have added in this snippet, but 16 is samples.

Thanks a lot @brianzinn, CreateScreenshotUsingRenderTarget() did work for me. I'm not sure why the CreateScreenshot() method was not working, though. Also, thanks for pointing out the additional parameters. This is how I found the antialiasing flag which I needed.

Can we contribute to the documentation? I'd be happy to fill in the blanks in cases such as this one.

Cheers!

Share this post


Link to post
Share on other sites
7 hours ago, Kesshi said:

When you create the BABYLON.Engine the option "preserveDrawingBuffer" has to be enabled. Maybe that helps.

Yes, it does help. Thanks. However, it causes other strange things to happen. I guess you have to manually empty the buffer otherwise some stuff remains visible... That's probably why this option is not even mentioned in the documentation ;-). Anyway, I'm gonna stick to CreateScreenshotUsingRenderTarget() since it is working fine for me. Thanks a lot for your input.

Share this post


Link to post
Share on other sites
22 hours ago, brianzinn said:

Yes, you can contribute to the documentation!!  It's a separate repo - here are instructions:
https://github.com/BabylonJS/Documentation#how-to-contribute

I was thinking more of the API documentation. I stumbled upon a few errors that are bound to trip people up (like it did for me). As far as I can tell, the API doc is generated from source so I guess I'll just submit PRs. Thanks.

Share this post


Link to post
Share on other sites

It's @Temechon!!  Holy crap!  Howyadoon, long-time comrade?  I hope well.  Geez, you sure have been elusive.  You must be working on a secret plan to take over the world!  Cooooool.  :)  Good to see ya!

Come visit for the fun of it, sometime, eh?   You don't need to wait for a deltaPing to bring you in for coffee/lunch.  :)

You're not "out there" trying to "make a living", are ya?  Yikes!

Making a living is SO over-rated and 1980's.  So is "out there". 

"In here" is lots better.  Us's and we's are "in here".   Them's and they's are "out there".  (huh?)

(From Wingy's new book - Bloody Stories from the US-THEM Wars)  heh

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.