Screenshot woes

Hi there, (sorry for the first post being a bug…)

I’m trying to pre-render orthographic images of blocks via screenshotting for a project I’m working on, but have ran into two issues (I’ve read through the docs, maybe I’ve missed something and they aren’t bugs).

The first issue is that if I attempt to screenshot with a camera that isn’t the active camera, the resulting image is blank.

The second is that regardless of the width/height ratio I specify for size, the ratio of the screenshot seems to be that of the canvas. Try squashing the browser window and see how it turns out.

Am I missing something fundamental here? :thinking:

Playground to demonstrate what I’m talking about:
https://playground.babylonjs.com/#YD2FLC

Any help would be appreciated :slight_smile:

1 Like

Welcome to the forum…

I didn’t even know we had this FEATURE!

Cool. I’ll have to check it out.

My workaround has been: Print Screen Button + Ctrl+N + Ctrl+V + Crop in Paint 3D.

It works. AND I will look into this. Others will be along shortly.

To your Question. I ran a search of the PLAYGROUNDS, here:

https://doc.babylonjs.com/playground/?code=CreateScreenshot

Maybe you could compare to see a solution.

~ : )

Well, your workaround does work I’ll give you that :smiley:

I was hoping to have all the icons and whatnot be generated dynamically, so if I needed to add another ‘block’ in the future (you can probably guess at the nature of my project now!) I wouldn’t need to create any other assets.

Currently putting up with squashed sprites, and having to change the active camera at the start to pre-render everything.

By momentarily setting the active camera to the orthogonal preview one and changing the canvas ratio just before rendering, and restoring them after, I can get the result I want. Technically works, but feels very dodgy and doesn’t seem to match the description in the docs (why does screenshot have a parameter for camera if it’s only going to use the scene’s active one, and why allow setting a custom resolution if the ratio is fixed to that of the canvas, wouldn’t you then just use precision?)

Fixed block previews above :smiley:

The function you want to use is CreateScreenshotUsingRenderTarget.

CreateScreenshot uses camera only to get the aspect ratio if you don’t provide both width and height, but it is not used for the rendering: the function takes the current canvas to create the screenshot.

In my testings, the width/height you pass are correctly taken into account, but the screenshot is empty because of some delayed available resources it seems: when doing it in a setTimeout(…, 1000) it does work.

Anyway, just use CreateScreenshotUsingRenderTarget and it will work out of the box.

1 Like

In my example I couldn’t get the width/height to work correctly, but no matter, the CreateScreenshotUsingRenderTarget method worked a treat! Thanks for explaining it :slight_smile: