html2canvas

前端页面导出PDF

由 随声附和 提交于 2019-12-17 10:12:16
【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 这是一个封装了的vue组件, 简单设置了导出的头, 内容, 底部. 内容可翻页. 实现导出列表所有页数. 实现是基于html2canvas把页面转换为图片, 然后使用jspdf把生成的图片直接添加到pdf里面. html2canvas 配置参考 地址 JSPDFS Github地址 js操作blob的大小限制, 网上找的图. 使用 <export-pdf-view ref="pdf" :begin="begin" :flush-content="loadList" :end="end" save-name="设备使用记录.pdf" class="recharge"> </export-pdf-view> 注: 回调函数需要返回 Promise , 如果回调函数内部有修改数据, 注意dom刷新后再调用Promise的res. 所有回调函数均在生成前调用 ref 使用ref来调用组件内部的方法 $refs.recharge.exportPDF() 导出pdf 回调函数 begin 开始导出时调用 回调函数 flush-content 开始导出内容时调用, 此方法会重复调用. 直到 Promise 的 res(false) 时结束, //可在这里重复加载列表数据 回调函数 end 生成pdf底部时调用

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

由 戏子无情 提交于 2019-12-17 08:59:32
问题 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 like var dataUrl = canvas.toDataURL(); //get's image string window.open(dataUrl); // display image Unfortunately, the documentations is very limited IMO. http://html2canvas.hertzen.com/documentation.html . I do not believe I need to preload as I am

html2canvas can not capture captcha images

由 安稳与你 提交于 2019-12-14 04:08:32
问题 Here is the html codes : <div id="divPage"> div_Page <br/> <img id="captchaimglogin" src="https://www.emirates.com/account/english/login/login.aspx?cptLogin_captcha=86e2a65e-f170-43b6-9c87-41787ff64a35&t=88d296b19e5e8000&mode=ssl" border="0" /> </div> <br/> <input type="button" id="btnSave" value="Save PNG"/> And here is jquery codes : $(function() { $("#btnSave").click(function() { html2canvas($("#divPage"), { onrendered: function(canvas) { document.body.appendChild(canvas); } });

HTML2Canvas not capturing canvas data in IE11

由 做~自己de王妃 提交于 2019-12-13 21:29:28
问题 I am using HTML2Canvas to capture screenshot of my html page and save it as image in server. My Html contains a d3.js chart and html elements. d3.js chart is generated as svg, so to capture svg, I use Fabric.js to convert svg to canvas element. After this process is complete I use Html2Canvas to capture the entire web page as image and save it in server. The whole process is working fine in Chrome and FF. Problem is when using IE. In IE 11, everything else in the page is captured except the

pdfmake generates blank pdf

由 微笑、不失礼 提交于 2019-12-13 16:23:12
问题 I'm trying to use pdfmake for generating pdf from html with html2canvas in angular2 here is my code this is a sample code what im trying to do original html contains dynamic data from APIs and whole page is too long thats why I tried to divide it with div component.ts createPdf(): void { var data_1; var data_2; var data_3; var data_4; var data; var p1 = new Promise((resolve, reject) => { html2canvas(document.getElementById('home'), { onrendered: function (canvas) { console.log(canvas); canvas

Cross origin issue occuring while converting amazon s3 images in div to canvas

由 Deadly 提交于 2019-12-13 14:16:47
问题 I am using htm2canvas to convert a particular div with images to canvas.This is working when images are local. I am getting this issue "Access to Image at 'https://mybucket.s3.amazonaws.com/B008C4GFP0.jpg' from origin 'http://mywebsite.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://mywebsite.com' is therefore not allowed access." when images are from amazon. Div I am coverting to canvas <div> <img id="img1"

html2canvas Chart.js chart not rendered

由 无人久伴 提交于 2019-12-13 03:30:26
问题 I am trying to export a div that contains a Chart.js chart as an Iamge. All elements are displayed perfectly fine, however, the Chart.js canvas just doesn't get rendered. I am calling my export function in the callback of the onAnimationComplete option in my chart, so the export can't happen before the chart is fully built. Here is how my html2canvas and download functions look: download() { this.dl.download = this.fileName; this.dl.click(); } loadDataUrl($node) { this.hideUnwantedElements();

jsPDF: fromHTML vs addHTML

由 ╄→尐↘猪︶ㄣ 提交于 2019-12-13 03:20:51
问题 I'm trying to export an html(within a div with ID), and have managed to do so with fromHTML(), but unfortunately it doesn't read/use any css I have. This said, I tried with addHTML function, but it looks like nothing happens when I use following code: function pdfExport(id) { window.html2canvas = html2canvas; var dddoc = new jsPDF('p', 'px', 'a4'); var elem_to_export = $("#cmodal-id-" + id)[0]; dddoc.addHTML(document.body, function(){ console.log('saving'); dddoc.save('test.pdf'); }); } Also,

Capture the screenshot of a webpage using html2canvas with png extension

由 喜欢而已 提交于 2019-12-13 01:05:41
问题 How to capture a screenshot of a webpage using html2canvas with png extension, and save it in a local folder? I tried the following code. It saves the screenshot with the file name download but without a png/jpeg extension. Any way to make it work? I also want to save the screenshot to a local folder. <html> <head> <meta charset="utf-8"/> <title>test2</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.js"></script> <script type="text/javascript" src ="http://code

html2canvas not working for large HTML content

由 眉间皱痕 提交于 2019-12-13 01:04:01
问题 I am trying to use html2canvas library, to save html that's dynamically generated and output to the page as image. If the HTML generated isn't too much, then the html2canvas would work just fine, however, if the html generated is really too big (when I try to print it, it's 70 pages), then the html2canvas will return a canvas object where canvas.toDataURL('image/png') returns data:; and that's it. I found a post online suggesting to change the maxInt in the html2canvas.js file to be Number
订阅 html2canvas