首先安装 html2Canvas 和 jspdf

npm i html2canvas -S

npm i jspdf -S

然后在vue页面引入

import html2Canvas from 'html2canvas'
import JsPDF from 'jspdf'

最后实现:

html2Canvas(document.querySelector('.hello'), { allowTaint: true }).then(function (canvas) {      //.hello是你要导出的范围
let contentWidth = canvas.width
let contentHeight = canvas.height
let pageHeight = contentWidth / 592.28 * 841.89
let leftHeight = contentHeight
let position = 0
let imgWidth = 595.28
let imgHeight = 592.28 / contentWidth * contentHeight
let pageData = canvas.toDataURL('image/jpeg', 1.0)
let PDF = new JsPDF('', 'pt', 'a4')
if (leftHeight < pageHeight) {
PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
} else {
while (leftHeight > 0) {
PDF.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
leftHeight -= pageHeight
position -= 841.89
if (leftHeight > 0) {
PDF.addPage()
}
}
}
PDF.save('earth.pdf')
})

Cesium导出PDF的更多相关文章

  1. .Net导出pdf文件,C#实现pdf导出

    最近碰见个需求需要实现导出pdf文件,上网查了下代码资料总结了以下代码.可以成功的实现导出pdf文件. 在编码前需要在网上下载个itextsharp.dll,此程序集是必备的.楼主下载的是5.0版本, ...

  2. JS导出PDF插件(支持中文、图片使用路径)

    在WEB上想做一个导出PDF的功能,发现jsPDF比较多人推荐,遗憾的是不支持中文,最后找到pdfmake,很好地解决了此问题.它的效果可以先到http://pdfmake.org/playgroun ...

  3. ITextSharp导出PDF表格和图片(C#)

    文章主要介绍使用ITextSharp导出PDF表格和图片的简单操作说明,以下为ITextSharp.dll下载链接 分享链接:http://pan.baidu.com/s/1nuc6glj 密码:3g ...

  4. JAVA导出pdf实例

    一.直接导出成PDF   Java代码 1. import java.io.FileNotFoundException; 2. import java.io.FileOutputStream; 3.  ...

  5. 利用ITextSharp导出PDF文件

    最近项目中需要到处PDF文件,最后上网搜索了一下,发现ITextSharp比较好用,所以做了一个例子: public string ExportPDF() { //ITextSharp Usage / ...

  6. iText导出pdf、word、图片

    一.前言 在企业的信息系统中,报表处理一直占比较重要的作用,本文将介绍一种生成PDF报表的Java组件--iText.通过在服务器端使用Jsp或JavaBean生成PDF报表,客户端采用超级连接显示或 ...

  7. Itext导出PDF,word,图片案例

    iText导出pdf.word.图片 一.前言 在企业的信息系统中,报表处理一直占比较重要的作用,本文将介绍一种生成PDF报表的Java组件--iText.通过在服务器端使用Jsp或JavaBean生 ...

  8. Ireport 报表导出 Poi + ireport 导出pdf, word ,excel ,htm

    Ireport 报表导出 Poi + ireport 导出pdf, doc ,excel ,html 格式 下面是报表导出工具类reportExportUtils 需要导出以上格式的报表 只需要调用本 ...

  9. Spring Boot 系列教程18-itext导出pdf下载

    Java操作pdf框架 iText是一个能够快速产生PDF文件的java类库.iText的java类对于那些要产生包含文本,表格,图形的只读文档是很有用的.它的类库尤其与java Servlet有很好 ...

随机推荐

  1. jq的ajax请求更改为axios请求时零碎总结

    #老版切新版更改处----ajax 更改为 axios //ajax$.ajax({ type: 'POST', url: url, data: data, success: success, dat ...

  2. 离线安装gcc_rpm(centos下安装gcc的方法之一)

    .解压gcc_rpm.tar.gz (我的CSDN账号下载过) tar -zxvf gcc_rpm.tar.gz .解压完进入文件夹,执行以下命令,挨个执行(如果报依赖错误,就加上"--fo ...

  3. mongodb重置密码

    1.删除服务,重新创建没有验证的服务 2.关闭服务后修改conf文件auth=false或者 3.重新开启服务后然后进入mongo 查看是否存在用户 use admin db.system.users ...

  4. react app相关知识

    1.快速新建名为hello-world项目的应用命令 npx create-react-app hello-world 2.使用serve来mock数据 ①先安装serve        npm i ...

  5. QByteArray和十六进制的QString(char*)相互转换

    #include <QCoreApplication> #include <QDebug> #include <QDataStream> QByteArray He ...

  6. vue2.0 组件的生命周期

    vue官方文档中给出的vue生命周期的流程图 如下: 生命周期探究 对于执行顺序和什么时候执行,看上面两个图基本有个了解了.下面我们将结合代码去看看钩子函数的执行. <!DOCTYPE html ...

  7. [CSP-S模拟测试]:简单的区间(分治)

    题目描述 给定一个长度为$n$的序列$a$以及常数$k$,序列从$1$开始编号.记$$f(l,t)=\sum \limits_{i=l}^ra_i-\max \limits_{i=l}^r\{a_i\ ...

  8. memcached 安装与简单实用使用

    一.简介 1.memcache与memcached的区别与联系: memcache是php的拓展,memcached是客户端,复杂的说:Memcache模块提供了于memcached方便的面向过程及面 ...

  9. Java + selenium Timeout接口用法介绍

    上一篇介绍了关于如何启动浏览器的方法.这篇文章要介绍一下,上一篇代码中关于等待时间的接口方法,代码如下: driver.manage().timeouts().pageLoadTimeout(5, T ...

  10. UVA 822 Queue and A

    题目链接:https://vjudge.net/problem/UVA-822 翻译摘自:<算法禁赛入门经典> 题目大意 你的任务是模拟一个客户中心运作情况.客服请求一共有n(1 ≤ n ...