js 生成pdf
- 最简洁的代码
<script src="js/html2canvas.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jspdf.debug.js" type="text/javascript" charset="utf-8"></script>
document.getElementById("savePdf").onclick = function() {
html2canvas(document.getElementById("tabContainer"), {
onrendered: function(canvas) {
//通过html2canvas将html渲染成canvas,然后获取图片数据
var pageData = canvas.toDataURL('image/jpeg', 1.0);
var pdfWidth = 210;
const pdf = new jspdf('p', 'mm', 'a4');
pdf.addImage(pageData, 'JPEG', 25, 25, pdfWidth - 50, ((pdfWidth - 50) / canvas.width) * canvas.height);
// 保存
pdf.save(`fileName.pdf`);
}
});
}
js 生成pdf的更多相关文章
- 用js生成PDF的方案
在java里,我们常用Itext来生成pdf,在pdf文件里组合图片,文字,画表格,画线等操作,还会遇到中文支持的问题. 那好,现在想直接在web前端就生成pdf怎么办,目前有以下几个解决方案 1:J ...
- js生成pdf报表
由于前台html已经动态生成报表,而且,前台有一个功能,一个date range组件,当你拖动的时候,报表会在不提交到后台的情况下动态变化.因此需要用到js生成生报表: 用到的组件: jquery.j ...
- js 生成 pdf 文件
话不多说好吧, 直接上demo图: 直接上代码好吧:(要引入的两个js 链接我放最后) <!DOCTYPE html> <html> <head> <met ...
- JS生成PDF文件
代码: var pdf = new jsPDF('p','pt','a4'); pdf.internal.scaleFactor = 1; //可以调整缩放比例 var options = { //p ...
- 前端生成pdf文件之pdfmake.js
转载:点击查看原文 pdfmake.js是一个简单的生成pdf文件的插件. pdfmake.js https://files.cnblogs.com/files/s313139232/pdfm ...
- js将 HTML 页面生成 PDF 并下载
最近碰到个需求,需要把当前页面生成 pdf,并下载.弄了几天,自己整理整理,记录下来,我觉得应该会有人需要 :) 先来科普两个插件: html2Canvas 简介 我们可以直接在浏览器端使用html2 ...
- 在js内生成PDF文件并下载的功能实现(不调用后端),以及生成pdf时换行的格式不被渲染,word-break:break-all
在js内生成PDF文件并下载的功能实现(不调用后端),以及生成pdf时换行的格式不被渲染,word-break:break-all 前天来了个新需求, 有一个授权书的文件要点击下载, 需要在前端生成, ...
- 在Vue&Element前端项目中,使用FastReport + pdf.js生成并展示自定义报表
在我的<FastReport报表随笔>介绍过各种FastReport的报表设计和使用,FastReport报表可以弹性的独立设计格式,并可以在Asp.net网站上.Winform端上使用, ...
- JS导出PDF插件(支持中文、图片使用路径)
在WEB上想做一个导出PDF的功能,发现jsPDF比较多人推荐,遗憾的是不支持中文,最后找到pdfmake,很好地解决了此问题.它的效果可以先到http://pdfmake.org/playgroun ...
- 生成PDF的新选择-Phantomjs
最近在node.js项目开发中,遇见生成PDF的需求,当然生成PDF不是一个新意的需求:我可以选择利用开源的pdfkit或者其他node pdf模块,或者通过edge.js调用.net/python下 ...
随机推荐
- 实验k8s ————— k8s 搭建[一]
前言 以前学习k8s记录的.这里简单整理一下搭建,当时是我们学习环境的搭建,正式环境得专门的运维人员来,毕竟人家考虑的东西不一样. 正文 这里用kubeadm进行搭建,更加详细信息,在这里: http ...
- IIS 部署到服务器上出现数据库连接失败
前言 以前遇到过本地运行没有任何问题,部署到服务器上却出现数据库连接失败. 正文 排查顺序: 数据库权限 我们的sql的账号决定了我们的权限,那么要观察下是否我们的账号有该数据库的读写权限,先把权限归 ...
- Visual Studio 2019汇编报错 warning LNK4258: 指令“/ENTRY:main@0”与开关“/ENTRY:main”不兼容;已忽略
Visual Studio 2019汇编报错 warning LNK4258: 指令"/ENTRY:main@0"与开关"/ENTRY:main"不兼容:已忽略 ...
- CDN基础知识
什么是CDN? CDN的全称是Content Delivery Network,即内容分发网络.其实现是通过在现有的Internet中增加一层新的网络架构,将网站的内容发布到最接近用户的网络" ...
- 《Effective C#》系列之(零)——概要
把全书的内容讲述完整可能需要很长时间,我可以先回答主要目录和核心的内容.如果您有任何特定问题或需要更详细的解释,请告诉我. <Effective C#>一书共包含50条C#编程建议,以下是 ...
- 力扣557(java)-反转字符串中的单词(简单)
题目: 给定一个字符串 s ,你需要反转字符串中每个单词的字符顺序,同时仍保留空格和单词的初始顺序. 示例 1: 输入:s = "Let's take LeetCode contest&qu ...
- Oracle、达梦:☆获取数据库对象、获取对象的DDL定义语句(达梦)
一.获取数据库对象(Oracle.达梦) 以下方式在达梦DM数据库中都能跑通,Oracle未测试所有的方式. 1.获取所有对象--所有模式下的 数据库所有对象表:包括表.视图.物化视图.函数.存储过程 ...
- SAP HANA计算视图
Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. 越来越多的SAP用户正在将SAP HANA实施为现有SAP BW的基础和数据库. ...
- ES_CCS/R(三):跨集群复制 Cross-cluster replication(CCR)
跨集群复制(CCR)功能支持将远程集群中的索引复制到本地集群. 可以在一些常见的生产用例中使用此功能: 灾难恢复(DR)/高可用性(HA):如果主群集发生故障,则进行灾难恢复. 辅助群集可以用作热备份 ...
- 7、yum 仓库服务与 PXE 网络装机
1.部署 yum 软件仓库 1.1.使用本地 yum 挂载 umount /dev/sr0 mount /dev/sr0 /media/mkdir /root/yum.bakmv /etc/yum.r ...