Questions tagged [html2canvas]

html2canvas is a JavaScript HTML-rendering library that lets you take "screenshots" of webpages based on the DOM.

From the official site:

This script allows you to take "screenshots" of webpages or parts of it, directly on the users browser. The screenshot is based on the DOM and as such may not be 100% accurate to the real representation as it does not make an actual screenshot, but builds the screenshot based on the information available on the page.

1794 questions
19
votes
3 answers

How to generate "screenshot" of html div with external images?

I have a HTML div with external images. (The following is an example, but in the actual case I am using Amazon S3, so downloading and storing the image on the same server is not an option) Currently I am using html2canvas to convert the div to…
cytsunny
  • 4,838
  • 15
  • 62
  • 129
19
votes
7 answers

SVG Text attribute is doubling - HTML2CANVAS

Here is mycode and link to JSFiddle. HTML
Vignesh Gopalakrishnan
  • 1,962
  • 9
  • 31
  • 53
18
votes
1 answer

jsPDF doesn't work in Chrome, only Firefox & Safari

I'm trying to export an application to a PDF using jsPDF. After browsing around the web, grabbing a line of code here, a section there - I have managed to get it working... somewhat. It works in Firefox & Safari, but not in Chrome. JS-Files used…
Effect Erik
  • 203
  • 2
  • 10
18
votes
5 answers

How do I get a multi-page pdf from a website using jsPDF and HTML2Canvas?

I have a script that uses HTML2Canvas to take a screenshot of a div within the page, and then converts it to a pdf using jsPDF. The problem is the pdf that is generated is only one page, and the screenshot requires more than one page in some…
Tom Nolan
  • 1,916
  • 4
  • 32
  • 51
18
votes
6 answers

create screenshot of webpage using html2canvas (unable to initialize properly)

I am attempting to use http://html2canvas.hertzen.com/ to take screenshots of my webpage. I am unable to initialize a canvas element using... var canvas = $('body').html2canvas(); If I were able to get a proper canvas I would follow with something…
mattyd
  • 1,643
  • 2
  • 17
  • 26
17
votes
5 answers

SVG not displayed when using html2canvas

I am working on a project where I need to generate a pdf file (onclick saveFile as PDF) on the client side as some data are not to be sent to the server. I have read about these options available; fileSaver.js and html2canvas, and none seem to help.…
Kennan Obura
  • 315
  • 1
  • 4
  • 14
17
votes
2 answers

html2canvas Tutorial?

I'd like to use html2canvas but I have no idea how. No offense to Hertzen, he's made a great script, but the documentation is incomplete so it's rather useless. I looked at JSFeedback but the whole script (which I had to 'steal' from the HTML…
apparatix
  • 1,492
  • 7
  • 22
  • 37
16
votes
4 answers

jsPDF: html2canvas not loaded while using new .html() method

I want to use jsPDF.html to convert html page to pdf, and I'm using this code: savePdf () { var pdf = new jsPDF({unit: 'mm', format: 'a4', orientation: 'portrait' }) pdf.html(document.getElementById('printable-cv'), { callback: function…
Alessandro Dentella
  • 1,250
  • 2
  • 16
  • 30
16
votes
7 answers

How to save a image in multiple pages of pdf using jspdf

I have a table(columns aligned differently) which is to be saved as pdf.I converted the table to image using html2canvas and then saved the image into pdf usng jspdf. It works well if the size of the image is less than or equal to page size of pdf…
user3687972
  • 308
  • 1
  • 6
  • 10
15
votes
3 answers

html2canvas in Angular - Cannot invoke an expression whose type lacks a call signature

I am trying to use the html2canvas library into an Angular 8 project. I also tried to install the html2canvas types in my project by npm install --save @types/html2canvas but it stills not working. Template:
... …
Jgascona
  • 1,201
  • 2
  • 13
  • 25
15
votes
7 answers

Image in PDF cut off: How to make a canvas fit entirely in a PDF page?

When placing the canvas in the PDF using the jspdf library makes the image cut off. html2canvas(myContainer, {background: 'red'}).then (canvas) -> imgData = canvas.toDataURL('image/jpeg', 1.0) window.open(imgData) # this is just a test that…
Gustavo Matias
  • 3,508
  • 3
  • 27
  • 30
15
votes
4 answers

JSPDF - addHTML() Multiple Canvas Page

I noticed already have a release "addHTML() can now split the canvas into multiple pages" which can find through this link : https://github.com/MrRio/jsPDF/releases/tag/v1.0.138. May i know how it work? In my case, i just tried it out when click on…
Dion Alexander
  • 169
  • 1
  • 1
  • 7
14
votes
1 answer

Copy Div with mixed content as image to clipboard

I am trying to build an application in which I need to copy an entire div as an image to the clipboard. The div can contain nested divs and images, svgs etc. I have searched for this a lot but am unable to find any answer to my…
Varun Sharma
  • 1,602
  • 1
  • 13
  • 37
14
votes
2 answers

HTML2Canvas converting overflowed content to image

I have a div which is pretty overflowed. It basically includes a big organization chart. What I want to do is exporting whole content of div rather than visible part with html2canvas library but I couldn't achieve it so far. Following piece of code…
Cengiz Kandemir
  • 375
  • 1
  • 4
  • 16
13
votes
4 answers

How to remember scroll position and scroll back

I am using html2canvas library and when I call html2canvas.Parse() the page scroll to top. I thought if i can remember the position before calling html2canvas.Parse(), so then i can go back to original scroll position. get the current position of…
Imran Naqvi
  • 2,202
  • 5
  • 26
  • 53