# Create screenshot generate blank/black image

**URL:** <https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773>\
**Category:** Questions\
**Created:** [June 17, 2020, 12:44pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773 "2020-06-17T12:44:47Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![Marcin\_Zamelski](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/marcin_zamelski/32/4999_2.png) [@Marcin\_Zamelski](https://forum.babylonjs.com/u/Marcin_Zamelski)\
**Post date:** [June 17, 2020, 12:44pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/1 "2020-06-17T12:44:47Z")

</div>

Hello guys,

I use CreateScreenshotUsingRenderTarget method to create screenshot of canvas at our site and it’s working for 99% of the time. Unfortunately lately some of our users started to report issue with this generating black image instead of product.

I have done some investigation and was able to track down that issue was probably related to too high number of samples (8). And lowering it to 1 seems to fix the problem. However that change results in visible drop in quality of generated images. So I’m rather reluctant to use that solution.

For now we only get report of problem happening only on Chrome. Initially I thought it could be related to hardware since I was only able to reproduce it on old Macbook from 2011. But then I got reports that it also happens for users with newer computers. Most of them seems to use Windows 7.

Out code for generating screenshot looks like

```
function captureScene(scene, callback) {
	const mimeType = 'image/jpeg';

    scene.clearColor = new Color3(255, 255, 255);

    Tools.CreateScreenshotUsingRenderTarget(scene.getEngine(), scene.activeCamera, {width: 1920, height: 1080}, callback, mimeType, 8, false);
}

```

We are using Babylon.js 4.0.3

Do you have any idea what may be the root of this issue? Is there other possible fix to that other then lowering samples number. Eventually maybe there is some way to get number of supported samples…

Thanks

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [June 17, 2020, 1:32pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/2 "2020-06-17T13:32:15Z")

</div>

Unfortunately it looks like a browser issue to me ☹ Would you be able to get more logs from the users console ?

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [June 17, 2020, 1:41pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/3 "2020-06-17T13:41:49Z")

</div>

One possible problem would be that some mesh effect/texture are not ready yet when taking the screenshot and so are not rendered.

You can try to call the screenshot function only if everything is ready in the scene:

```javascript
function captureScene(scene, callback) {
    scene.executeWhenReady(() => {
        const mimeType = 'image/jpeg';
        scene.clearColor = new Color3(255, 255, 255);
        Tools.CreateScreenshotUsingRenderTarget(scene.getEngine(), scene.activeCamera,
            {width: 1920, height: 1080}, callback, mimeType, 8, false);
    });
}

```

---

<div class="post-metadata">

**Author:** ![mimeeq3d\_neal](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mimeeq3d_neal/32/13877_2.png) [@mimeeq3d\_neal](https://forum.babylonjs.com/u/mimeeq3d_neal)\
**Post date:** [June 17, 2020, 2:11pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/4 "2020-06-17T14:11:53Z")

</div>

Hi, @Evgeni_Popov @sebavan thanks for the comments, probably worthwhile us adding it, however, I think it’s not this because this is an image generation which is run manually by clicking an icon and then a pop up where you pick the image size and type. I cannot imagine the user trying to run this before they edit the configuration @Marcin\_Zamelskiwill be best to reply however

Example Product can be found here [https://mimeeq.co.uk/demo-product](https://mimeeq.co.uk/demo-product)  
you can click generate an image in the top icons

 ![Screenshot 2020-06-17 16.09.20](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/a/a0ce6f6f8b9c5a8a4c28808fb8c50a33a536f49c.jpeg)

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [June 17, 2020, 2:27pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/5 "2020-06-17T14:27:03Z")

</div>

> [@mimeeq3d\_neal](#):
>
> cannot imagine the user trying to run this before they edit the configuration

I can’t either, but I’m still able to get a blank (white) screenshot by refreshing the page then quickly cliking on the “save” icon and “Generate image” button before the asset is downloaded/displayed.

Just to be extra sure, you could enable the “save” icon (as well as the “export” and “generate pdf” too) only when the scene is ready.

---

<div class="post-metadata">

**Author:** ![Marcin\_Zamelski](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/marcin_zamelski/32/4999_2.png) [@Marcin\_Zamelski](https://forum.babylonjs.com/u/Marcin_Zamelski)\
**Post date:** [June 17, 2020, 2:45pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/6 "2020-06-17T14:45:51Z")

</div>

Thanks for answers.  
I was mostly trying to export after everything was loaded. And error still pop out. We will of course block it until everything is loaded.

@sebavan Ok it looks like I did rookie error and didn’t checked warnings (I use mostly errors) in console. It looks like console clearly says that there is too big number of samples. Question is how do I know what is the range for it then.

 ![logs](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/9/99cfca33c830b90318e28693adb465dc766daa57.png)

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [June 17, 2020, 2:48pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/7 "2020-06-17T14:48:01Z")

</div>

you can access it with engine.getCaps().maxSamples 🙂

---

<div class="post-metadata">

**Author:** ![mimeeq3d\_neal](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mimeeq3d_neal/32/13877_2.png) [@mimeeq3d\_neal](https://forum.babylonjs.com/u/mimeeq3d_neal)\
**Post date:** [June 17, 2020, 3:19pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/8 "2020-06-17T15:19:16Z")

</div>

@Evgeni_Popov  
Ha ha well your absolutely right good point.  
We will block the UI, it’s actually on my list for the team to do as of right now 🙂

I see Marcin has chimed in so I am going to leave it him.

Thanks for swift replies all 🙂

---

<div class="post-metadata">

**Author:** ![Marcin\_Zamelski](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/marcin_zamelski/32/4999_2.png) [@Marcin\_Zamelski](https://forum.babylonjs.com/u/Marcin_Zamelski)\
**Post date:** [June 18, 2020, 6:51am UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/9 "2020-06-18T06:51:43Z")

</div>

Unfortunately it looks like that variable was introduced in newer version of Babylon since it’s missing at 4.0.3. But since I know what I was looking for I checked source code and was able to get that number by myself.

Anyway it returns 4 samples on my mac what is clearly too big since it results in black image.

However I can use it to at least distinguish between if it support our initial 8 or not and make it 8/1. It’s still much better then dropping to 1 for everyone.

Big thanks for help!

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [June 18, 2020, 12:39pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/10 "2020-06-18T12:39:37Z")

</div>

On mac it returns 4 but fails ??? could you share on which browser as it might be good to let them know ?

---

<div class="post-metadata">

**Author:** ![mimeeq3d\_neal](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mimeeq3d_neal/32/13877_2.png) [@mimeeq3d\_neal](https://forum.babylonjs.com/u/mimeeq3d_neal)\
**Post date:** [June 18, 2020, 4:11pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/11 "2020-06-18T16:11:42Z")

</div>

@sebavan Marcin was working on some important task so probably missed this reply. I saw it now only my self.  
I checked our internal project chat and found this (see the screenshot).

So it’s a MacBook with chrome that we tested with. It’s from 2011 since all other machines it worked fine on. Also you can see safari on Mac was fine.

Marcin told me that with chrome only 1 samples works but it returns that 4 should work.

So 2011 MacBook with chrome.

Here is the screenshot from the internal chat we were having in the subject.

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/5/5aeb1f0b04e92a5735ac2a3c1e325519de36150e.jpeg)

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [June 18, 2020, 5:37pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/12 "2020-06-18T17:37:26Z")

</div>

So might be worth creating an issue on the chrome side ?

---

<div class="post-metadata">

**Author:** ![mimeeq3d\_neal](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mimeeq3d_neal/32/13877_2.png) [@mimeeq3d\_neal](https://forum.babylonjs.com/u/mimeeq3d_neal)\
**Post date:** [June 18, 2020, 7:27pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/13 "2020-06-18T19:27:43Z")

</div>

you mean reporting to chrome as a bug?

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [June 18, 2020, 11:26pm UTC](https://forum.babylonjs.com/t/create-screenshot-generate-blank-black-image/11773/14 "2020-06-18T23:26:53Z")

</div>

Yup cause they provide an unsupported max number of samples it looks like.