<script src="jquery-3.6.3.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script> <div id='contatiner' style='height: 100px; width: 100px; background-color: white;'></div> <button id='screenshot' onclick='getScreenshot()'>Screenshot!</button> <script> function getScreenShot(){ //let c = this.elem.nativeElement.querySelector('.chartContainer'); // or document.getElementById('canvas'); let c = document.getElementById('container'); html2canvas(c).then((canvas:any)=>{ var t = canvas.toDataURL().replace("data:image/png;base64,", ""); this.downloadBase64File('image/png',t,'image'); }) } downloadBase64File(contentType:any, base64Data:any, fileName:any) { const linkSource = `data:${contentType};base64,${base64Data}`; const downloadLink = document.createElement("a"); downloadLink.href = linkSource; downloadLink.download = fileName; downloadLink.click(); } </script>