Take screenshot of cesium map including custom infobox

Hi everyone,
I have a cesium application where I have rendered osm buildings, 3dtiles, etc.
I have created a custom infobox for my 3dtiles. I have also created a print button to take a screenshot of the map including infobox. I can take screenshots but infobox is not coming.

output:

Expected output:

Can anyone help me?

Thanks in advance.

Hi @Masum_Billah

Could you share the code that you’re using to take the screenshot, preferably as a Sandcastle?

Thanks,
Sam.

Hi @sanjeetsuhag
Thanks for your response.
Here is the code that I am using to take screenshot.

  viewer.render();
  var image = viewer.canvas.toDataURL();
  var aLink = document.createElement("a");
  aLink.download = "map.png";
  aLink.href = image;
  aLink.click();

Hi @Masum_Billah

Thanks for sharing your code. The code you are using will only capture the contents of the WebGL canvas i.e. the CesiumJS scene, and not any DOM elements on top of the canvas, like the infobox. I believe you’ll have to use your browser or operation systems’s screenshot tools to capture both the canvas and the DOM elements.

Sam.