search

daattali / shinyscreenshot

📷 Capture screenshots of entire pages or parts of pages in Shiny apps
https://daattali.com/shiny/shinyscreenshot-demo/
Other
72 stars 8 forks source link

Increased CORS errors with leaflet - solved #16

Closed ferguskeatinge closed 2 years ago

ferguskeatinge commented 2 years ago

At higher zoom levels, html2canvas encounters a high number of CORS errors even with useCORS set to TRUE. I believe html2canvas is working too quickly for the leaflet tiles to load, and just sending a generic CORS error.

These errors resulted in a huge number of blank tiles when using screenshot function.

I solved this issue by modifying the shinyscreenshot.js file asset to include two additional parameters in the html2canvas element var, the addition of allowTaint and ForeignObjectRendering, set to true.

CORS errors disappeared, but now the "selector" doesnt seem to be working as it should, including additional elements in the screenshot - when allowTaint and ForeignObjectRendering are set to true, when set to false they do not cause any issues to the selector.

html2canvas( element, { scale : params.scale, allowTaint: true, foreignObjectRendering: true, logging : false, useCORS : true } )

daattali commented 2 years ago

Thanks for the report and investigative work. I do appreciate it, but if this solution causes another problem (selector not working) then I'd rather not implement it. If anyone can find a solution that doesn't result in a new issue, I'd be happy to include it.

You can check the README for other similar packages that may do a better job at screenshotting leaflet.