Download Entity Polygon as an image

Hello, I want to download a png screenshot of a polygon like this one:

The approach that I was using is to download a screenshot using:
const canvas = viewer.canvas;
window.location.href = canvas.toDataURL(‘image/png’).replace(‘image/png’, ‘image/octet-stream’);

But this is obviously downloading a screenshot of the entire map when I click on the entity, so I want to know if there is a way of taking only the entity, as a png. Thank you

Hi @Erik_Hansen , Very interesting question you’ve posted here. I may be wrong but it seems achievable by following these steps:
1st - Calculate the Bounding Box of the entity (Cartesian3 values) [ You can use turfjs ]
2nd- Convert them to window Coordinates to get Canvas Coordinates by (SceneTransforms - Cesium Documentation).
3rd- Calculate Width/Height of coordinates (areaBBoxWidth/areaBBoxHeight)
4th- Use canvas.toDataURL method :

var canvas = document.createElement('canvas');
canvas.width = areaBBoxWidth;
canvas.height = areaBBoxHeight;
canvas.getContext('2d').drawImage(viewer.canvas,x,y,w,h,0,0,areaBBoxWidth, areaBBoxHeight);
window.location.href == canvas.toDataURL()
  • Best Regards
1 Like