Hello,
I’m taking screenshot (as .png) file. The output image has more blue color area and the actual image is occupying less area. I want the original image to occupy most of the area.
Can some one suggest how can I achieve it.
This is the image how I got using screenshot function
My desired output should be like the below image (I did this by cropping manually, but I’m looking if there is any functionality available for this).
TIA
On my reading of the docs, that function captures whatever the current canvas aspect ratio is, so you’ll either need to explicitly set the canvas size to create the aspect ratio you want, then position the camera so that the book fits snugly in frame, then take the screenshot … or explore the last option on that docs page - Specific resolution with screenshot.
Actually it looks like the method CreateScreenshotUsingRenderTarget gives you the option to specify height and width of rendered output, independent of current canvas size, so that should make it easy.
Here’s a PG I found that saves a screenshot of a specific size and also has a transparent background (clearColor.alpha = 0)
Thanks @inteja
In the images I attached in the question, i’ve used aspect ratio values {width:1080, height:1920} . But still seeing most of blue color area in the background (My requirement is to reduce the background size and increase the actual image size).
I’m sorry, i am not able to post PG link as I did it in my local and it has dependencies on my local files.
Just thinking it this way - Can we make use of boundingBoxes and clip.
I’m really not sure we can do that way or not, but just giving a thought.
Well that aspect ratio is wrong - it’s portrait but from your original post you need landscape. So swap height and width values, then as I said you’ll need to adjust your camera so book fits snugly in frame.
I still need some more object to be cropped after changing the camera position and height/width aspect ratio. Can I do cropping based on bounding boxes ?
TIA.
No. That’s not what bounding boxes are for, and camera clipping planes I don’t think will achieve what you’ve described.
I see you’ve made another topic about this, but the new topic doesn’t show you’ve tried changing aspect ratio and moving the camera as suggested.
Given your book is a near rectangle, you should be able to do what you’ve described with the above technique.
Make a PG based on your previous PGs if you need more help.
@inteja I’ve achieved what I wanted.
Unfortunately I cannot share PG because of dependencies on my local files.
But here is the piece of code which has helped me to achieve my task.
ScreenshotTools.CreateScreenshotAsync(engine, camera, {width:1920, height:1080}).then((data) => {
try{
Jimp.read(data).then(image =>{
image.crop(25,695, 1050, 536)
const a = document.createElement('a');
image.getBufferAsync(Jimp.MIME_PNG).then(Buffer => {
a.setAttribute('download', 'snapshot.png');
a.setAttribute('href', Buffer.toString());
a.click();
})
})
}
catch(err){
console.log(err);
}
Note - I made of use of external JS library Jimp for cropping.
Thanks for responding patiently.
You already have previous PGs with the relevant geometry. You don’t need a reliance on local assets to demonstrate what you want in a PG.
Anyway, as previously suggested, all you need to do is move the camera closer to the book before creating the screenshot. You don’t need an external cropping library in this case if I understand your requirements correctly.