How to implement front-end screenshots?

Hi! everyone, I am using Cesium to create a simple WebGIS application, and I want to achieve the function of loading a 3D Tiles model and providing a screenshot button on the front end, so that users can save images of model. I achieved this function by converting Canvas into images, but I encountered a problem: the resolution of images generated through Canvas is affected by the display screen resolution. For example, if the display screen I am using has a resolution of 1400 * 800, clicking the button on this display screen will generate images with a resolution of 1400 * 800. I hope to unify the resolution of screenshots, so I can provide screenshots of the same resolution on monitors with different resolutions. For example, even if I use a monitor with a resolution of 1400 * 800, it can provide screenshots of 1920 * 1080. Or what better way to take a screenshot besides converting Canvas?

Hi there,

I would suggest using resolutionScale. Increase the value before taking the screenshot, then set it back once completed.

The tricky part of taking a higher resolution screenshot is that it will affect the level of detail and the number of 3D Tiles which are loaded in. Ideally, you should wait for any additional tiles to be loaded before taking the screenshot.

Thank you very much for your answer. It has been very helpful to me.

Could you please provide me with a sample code to use resolutionScale?Thank you.

Sure, here’s one.