使用html2canvas和jspdf导出pdf包含跨页以及页脚

首先要下载两个文件,一个为html2canvas.min.js,另一个是jspdf.umd.min.js这两个文件分别下载的地址我也附录上,都在官网git:

html2canvas.min.js: https://html2canvas.hertzen.com/dist/html2canvas.min.js

jspdf.umd.min.js: jsPDF/dist/jspdf.umd.min.js at master · parallax/jsPDF · GitHub

jspdf.umd.min.js去dist中获取

我都是建立文件然后复制粘贴进去,这样比较方便

之后就是放到我们的项目中然后全局引入就可以了

之后就可以在使用的地方写我们的代码了

这个里面我加入了黑体这个字体因为在添加页脚的时候,中文会进行乱码

这个乱码处理是我首先把jspdf项目从git上下载下来:https://github.com/parallax/jsPDF

之后打开下图这个文件中的html文件

然后出来的就是这个之后我们需要下载一个.ttf字体文件:SimHei.ttf|字体下载

下载之后我们就可以通过选择文件按钮把.ttf文件上传到上面然后我们命名一个fontName,然后点击create生成一个字体的js文件,如果你的是vue项目那么直接引入使用即可,但是如果不是,我进行的处理是把其中的font复制出来自己建一个js文件

把这个font字体绑定在window上这个全局都可以进行使用

引入这个文件都在最上面第二张图

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/341367.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

vue-pdf 部分中文显示错误,第二次打开是空白,解决方法

首先鸣谢 1. https://blog.csdn.net/m0_71537867/article/details/131614868?spm1001.2014.3001.5506 2. https://blog.csdn.net/weixin_43763952/article/details/133769647 3. https://github.com/FranckFreiburger/vue-pdf/issues/229 4. https://blog.csdn.net/weixin_449…

康谋技术 | 自动驾驶:揭秘高精度时间同步技术(一)

众所周知,在自动驾驶中,主要涵盖感知、规划、控制三个关键的技术层面。在感知层面,单一传感器采集外界信息,各有优劣,比如摄像头采集信息分辨率高,但是受外界条件影响较大,一般缺少深度信息&…

推荐一个免费的相亲工具

推荐一个免费的相亲工具,步骤如下: 1)微信里面搜索公众号“光源桥”,并关注 2)输入搜索条件进行搜索对象 例如下面搜索:

Pinterest免费引流实操演示

这篇文章中你将了解到 1.Pinterest网站介绍,用户群体,适合做什么品类。 2.现在的商家都在上面做什么?案例展示。 3.我们在这个站免费引流要怎么做以及注意事项。 1.Pinterest网站介绍,用户群体,适合做什么品类。 P…

【Excel】Excel中将日期格式转换为文本格式,并按日期显示。

【问题需求】 在使用excel进行数据导入的过程中, 有的软件要求日期列必须是文本格式。 但是直接将日期列的格式改为文本后,显示一串数字,而不按日期显示。 进而无法导入使用。 【解决方法】 使用【TXET】函数公式进行处理, 在单…

百度ERNIE系列预训练语言模型浅析(4)-总结篇

总结:ERNIE 3.0与ERNIE 2.0比较 (1)相同点: 采用连续学习 采用了多个语义层级的预训练任务 (2)不同点: ERNIE 3.0 Transformer-XL Encoder(自回归自编码), ERNIE 2.0 Transformer Encode…

泛微开发修炼之旅--05Ecode入门讲解、接口调用源码示例及踩坑总结

文章链接:泛微开发修炼之旅--05Ecode入门讲解、接口调用源码示例及踩坑总结

操作系统复习-linux的进程管理

linux的进程管理 linux进程的相关概念 进程的类型 前台进程 前台进程就是具有终端,可以和用户交互的进程,会占用终端shell,不可以输入其他的命令。 后台进程 前台进程就是具有终端,可以和用户交互的进程。 不会占用终端shell&a…

数据分析必备:一步步教你如何用Pandas做数据分析(17)

1、Pandas 连接 Pandas 连接的操作实例 Pandas具有与SQL等关系数据库非常相似的功能齐全的高性能内存中连接操作。 Pandas提供单个功能merge作为DataFrame对象之间所有标准数据库联接操作的入口点 pd.merge(left, right, howinner, onNone, left_onNone, right_onNone,left_i…

实战|基于YOLOv10与MobileSAM实现目标检测与分割【附完整源码】

《博主简介》 小伙伴们好,我是阿旭。专注于人工智能、AIGC、python、计算机视觉相关分享研究。 ✌更多学习资源,可关注公-仲-hao:【阿旭算法与机器学习】,共同学习交流~ 👍感谢小伙伴们点赞、关注! 《------往期经典推…

[240605] FreeBSD 发布 v14.1 | ChatGPT 出现故障,部分用户无法使用

目录 FreeBSD 发布 v14.1ChatGPT 出现故障,部分用户无法使用 FreeBSD 发布 v14.1 一、概述 FreeBSD 项目发布了 FreeBSD 14.1-RELEASE,这是 stable/14 分支的第二个稳定版本。 二、主要更新 C 库在 amd64 架构上实现了 SIMD 字符串和内存操作&#x…

Navicat使用ssh隧道连接mysql数据库

转载请标明出处:http://blog.csdn.net/donkor_/article/details/139352748 文章目录 前言新建连接MySql,填写ssh隧道信息方式1:使用密码方式连接方式二:使用密钥方式连接 填写常规信息总结 前言 使用ssh隧道连接数据库,方便本机…

月入30000的软件测试人员,简历是什么样子的?

我们都知道,简历是一个人进入职场的敲门砖。从某种层面来说,简历也像一个人的具象身份证,或者专业资格证。所以,一份简历的好坏,不仅关乎个人的“脸面”,更关乎你是不是一个有“含金量”的技术人员。 所以…

<vs2022><问题记录>visual studio 2022使用console打印输出时,输出窗口不显示内容

前言 本文为问题记录。 问题概述 在使用visual studio 2022编写代码时,如C#,在代码中使用console.writeline来打印某些内容,以便于观察,但发现输出窗口不显示,而代码是完全没有问题的。 解决办法 根据网上提供的办法…

FastDFS分布式文件系统

一、概述 FastDFS是一款由国人余庆开发的轻量级开源分布式文件系统,它对文件进行管理,功能包括:文件存储、文件同步、文件访问(文件上传、文件下载)等,主要解决大容量文件存储和高并发访问问题&#xff0c…

ru域名如何申请ssl证书

SSL证书是一种数字证书,通过它可以在客户端和服务器之间建立加密通道,保证数据在传输过程中的安全性。对于.ru域名来说,申请SSL证书可以有效提升网站的安全性,增强用户对网站的信任度,提高网站的排名和权重。今天就随S…

C#使用GDI对一个矩形进行任意角度旋转

C#对一个矩形进行旋转GDI绘图,可以指定任意角度进行旋转 我们可以认为一张图片Image,本质就是一个矩形Rectangle,旋转矩形也就是旋转图片 在画图密封类 System.Drawing.Graphics中, 矩形旋转的两个关键方法 //设置旋转的中心点 public v…

【遂愿赠书 - 2期】:618火热来袭,网络安全书单推荐

文章目录 一、网络安全书单背景二、网络安全与编程实践书单2.1 🏰《内网渗透实战攻略》2.2 🛡️《Kali Linux高级渗透测试(原书第4版)》2.3 🎖️《CTF那些事儿》2.4 🚀《权限提升技术:攻防实战与…

JVM学习-类加载过程(二)

Initialization初始化阶段 为类的静态变量赋予正确的初始值 具体描述 类的初始化是类装载的最后一个阶段,如果前面的步骤没有问题,那么表示类可以顺利装载到系统中,此时,类才会开始执行Java字节码(即,到了初始化阶段…

LLVM技术在GaussDB等数据库中的应用

目录 LLVM和数据库 LLVM适用场景 LLVM对所有类型的SQL都会有收益吗? LLVM在OLTP中就一定没有收益吗? GaussDB中的LLVM 1. LLVM在华为应用于数据库的时间线 2. GaussDB LLVM实现简析 3. GaussDB LLVM支持加速的场景 支持LLVM的表达式&#xff1a…