Jean-Philippe Côté

Empty screenshot

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
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

public methods would ideally be documented like BABYLON.Tools.Mix(...). https://github.com/BabylonJS/Babylon.js/blob/master/src/Tools/babylon.tools.ts#L93

The docs then show up in the editor and should be generated online looks like by TypeDoc:

mix.thumb.png.d19881d9be7d9ed63bde73d514983741.png

... instead of the less helpful CreateScreenshotUsingRenderTarget :)

createscreenshot.thumb.png.572279cc098bada1cdb5669bf8b9ab3d.png

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

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.