html2canvas

问题 I have a component MyNodeComponent that takes a target HTML element as part of the input object in my Angular 7.2.15 : @Component({ selector: 'my-node', templateUrl: './my-node.component.html' }) export class MyNodeComponent implements OnInit, OnChanges, AfterViewInit { @Input() inputObject: [{target: HTMLElement, desc: string}]; ... } The problem is I am not sure how to send an HTML DOM node to target in a dynamic fashion. Especially as there could be multiple instances of MyNode on a page

问题 I was trying to generate PDF from HTML using jsPDF and html2canvas. It worked with full page, but not specific div using getElementById() . The console says IndexSizeError: Index or size is negative or greater than the allowed amount html2canvas.js:2859 Here's my script <script> let doc = new jsPDF(); doc.addHTML(document.getElementById('content'), function() { doc.save('html.pdf'); }); </script> can anyone help me with this? 回答1: doc.addHTML() is actually deprecated now. The new vector

问题 Some issues using Javascript library html2canvas. The problem is that html2canvas is getting "div2" with a transparent (sometimes white) background, I want to include the body background (or is behind this div) on "div2". <div id="div2" style="width: 150px; height: 50px;"></div> html2canvas(document.getElementById("div2"), { onrendered: function(canvas) { var photostring = canvas.toDataURL("image/png"); console.log(photostring); } }); 回答1: Logically the rendering works from the element you

问题 is there anyway to solve this issue? The html2canvas is not rendering when the document.body height is more than 30,000 pixels. Or can i render the current viewport only? On what the user can see? Please help. 回答1: To be able to render only current active viewport you can initialize html2canvas with type:'view' option example: var body = document.getElementsByTagName("body")[0]; html2canvas(body, { type: 'view', onrendered: function(canvas) { //implementation } }) I tested the above code with

问题 I'm currently having issues while rendering complex DIV element into CANVAS element using Html2Canvas package. The problem is the DIV I want to write to the CANVAS, has overflow: auto So the DIV is bigger than the screen ratio. and to add gasoline to the fire, all described above is in the Angular 5 component, what means the CSS isn't available while I'm accessing to ElementRef.nativeElement.innerHTML . Encapsulation.None didn't work for me here either. HTML to canvas settings: async: true,

问题 I have a webpage on which I wish to print some HTML. To do so, I use html2canvas and jsPDF . The issue that I encounter is that it does not print the images shown in the HTML. My HTML and css looks as follows (complete code in fiddle): .handsomeHtml { background: red; } .crazyFrog { background: url('http://e-cdn-images.deezer.com/images/artist/01eb92fc47bb8fb09adea9f763bb1c50/500x500.jpg'); width: 500px; height: 500px; } <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1

问题 I am looping through 10-14 html elements, and generating image data in an array for later use for insertion into a PDF. The problem is that these images occasionally have a horizontal line across them, which seems seems to be an existing issue with html2canvas. Happens mostly in FF and IE, and occationally on Chrome, but not as often. function convertElementsToImages(containerSelector) { if (_this.pdfDebug) { window.console.log('convertElementsToImages'); window.console.log(containerSelector)

问题 Html2Canvas works perfectly to make div content download, but when the div contains css filters the html2Canvas not apply the filters in the generated image. https://github.com/niklasvh/html2canvas/issues/246 Would welcome suggestions for something similar to Html2Canvas to download (image) the contents of a div Thanks for any help 来源： https://stackoverflow.com/questions/34684048/html2canvas-not-working-for-webkit-filter-suggestions-for-similar

问题 I use Html2Canvas and then jsPdf to export the image. This is the function: function exportPdf() { content = $("#print"); var useWidth = content.prop('scrollWidth'); var useHeight = content.prop('scrollHeight'); debugger; html2canvas((content), { width: useWidth, height: useHeight}).then(function (canvas) { debugger; var img = canvas.toDataURL("image/png"); var doc = new jsPDF({ unit:'px', format:'a4' }); debugger; doc.addImage(img, 'JPEG', 0, 0); doc.save('test.pdf'); }); } I think is taking

问题 I use Html2Canvas and then jsPdf to export the image. This is the function: function exportPdf() { content = $("#print"); var useWidth = content.prop('scrollWidth'); var useHeight = content.prop('scrollHeight'); debugger; html2canvas((content), { width: useWidth, height: useHeight}).then(function (canvas) { debugger; var img = canvas.toDataURL("image/png"); var doc = new jsPDF({ unit:'px', format:'a4' }); debugger; doc.addImage(img, 'JPEG', 0, 0); doc.save('test.pdf'); }); } I think is taking