High Resolution Canvas Snapshot ?

Hello, is there a way to produce a snapshot of the canvas at higher resolution than the screen?

For example I would like to produce an screenshot from my game that can be printed to A4, but it gets pixelated when creating a snapshot from say a 480x800 mobile phone resolution.

Any tricks or plugins or work-arounds?

Thanks

Look into R0J0's excellent Paster plugin - it has some hangups with opacity and shaders, but you can place that bad boy in your scene, set a resolution and go wild (within the constraint's of the max texture size of your graphics card).

You could probably even make a system that uses a loop to sequentially move the object around the screen and take several snaps of fairly high-res to be combined into a huge one.

Thanks Somebody - I am not sure I understand how Paster then exports itself into a snapshot. While it can load textures from URL or from the entire canvas, it doesn't seem to have any action that extracts its texture back into an URL like Scirra's "System>take snapshot of canvas" action does. Am I missing something?

As for the idea of sequentially moving the object and taking snaps, it does sound like it could work but would require a server-side script to combine the snaps, and I was hoping to avoid that.

Easy as pie!

ha! thank you Somebody (and R0J0hound for making the plugin)! it's producing the file, but it's blank, although I tried to do "Paster>Load texture from canvas" before invoking the imageUrl. I supposed that would copy the entire canvas into the Paster (an equivalent of System>save canvas snapshot, but resolution independent) - is that not the case?

I will mess around more with it and share the capx if I can't figure it out. If am wrong about what to expect from the Load texture from canvas action, please tell me how it should be used.

+++

Got it to work, but not really as expected.

I was very happy to see your wonderful StuffGen Somebody - beautiful interface and indeed quite fun to use. I am myself also doing an app, not a game, so was encouraged by how neat yours is. I particularly salute the way you've used paster to export the designs.

I was wondering if you could help me in figuring out how to do the inverse of what you did, you see you are taking a large canvas and exporting parts of it, generally to same or smaller resolutions, to be used on screen.

In my app, I need to do the opposite, namely I need to create PNGs that are at a higher resolution than the screen to be printed (hint: am making a kind of paper-art design app).

I have managed to create larger-than-screen PNGs but the image pasted is just scaled up from the screen resolution without any gain in detail, quite the opposite.

The original sprites are larger than the pixels they appear on screen at. For example, the object could be 512x512, but would be scaled down on some screens to appear say 128x128px in size. But i needed to be printed at 5x5cm at 200dpi, which is around 400x400px.

Using the setup in R0J0hound's paster_loadCanvas.capx: a backdrop Paster1 that loads the canvas, then a front Paster2 that pastes Paster1, and exporting Paster2.imgURL, the resulting image is large, but bad.

Attached are two ways of producing the image, one with the built-in CanvasSnapshot, so same resolution than screen, and the other is with Paster, at custom resolution almost 7x Screen.

Is it a built-in limitation that loadCanvas is essentially just passing CanvasSnapshot into Paster, at screen resolution?

[attachment=0:1sl2xqd3][/attachment:1sl2xqd3]

[attachment=1:1sl2xqd3][/attachment:1sl2xqd3]

icepam - thank you for the kind words. In fact my system already does the upscaling, it's just not available in the public version - but normally the designs are exported at 200%. The trick is this - if you capture the canvas the sprites are already there and upscaling only makes the pixels larger. In my case all the designs are the same sprite so it's easy to use the "Paste sprite onto paster" command. And this is where the magic happens - as you have a higher resolution paster then the separate objects are pasted into it at the highest possible resolution. I'm not sure how your system is set up, but perhaps you could try to add all the active objects to a family and paste that or just set up a series of sequential pastes.

Good luck, do share the results.

hahahaha it works! thank you so much Somebody!

btw, are you using cranberrygame's amazing SquareBoard/Grid plugin? or something similar for StuffGen?

[attachment=0:1tmh8ekz][/attachment:1tmh8ekz]

icepam - wow, quite the resolution you got there! What's your graphics card if you don't mind sharing? Just be wary that not all users will be able to have such large images and there is a small risk of a crash if that is the case. You may want to put in some contingency plan, perhaps export a smaller image first and then try a bigger one. In StuffGEN I can afford to experiment since it lets you save and load things, but in a closed system it might be a risk.

And StuffGEN is basically all done by hand, it doesn't use any plugins except for Paster so far (and some of my shaders).

yes, it does crash on me every other try. In reality I need half this resolution so it should be ok in practice. My laptop has an Nvidia GEFORCE with 2GB vram.

thanks again and kudos for SG.

How can i take full layout screenshot(A4 size with best resolution)? not just window. I think you buddy icepam Somebody can help me.

But I can't paste a tint effect enabled sprite on Paster.

Mahbub918

You can do it with the "take snapshot" action. Just set the canvas size to the layout size, capture, then set the canvas size back to normal. There's probably some browser limits to how big you can make the canvas though.

start of layout

system: set canvas size to layoutWidth x layoutHeight

system: Take snapshot of canvas

system: on canvas snapshot

browser: invoke download of canvassnapshot with filename "layout.png"

system: set canvas size to 640 x 480