System.ArgumentOutOfRangeException: 索引和长度必须引用该字符串内的位置。 参数名: length 在 System.String.Substring(Int32 startIndex, Int32 length) 在 zhuanliShow.Bind() 一种将网页转为可分页的pdf的方法技术_技高网

一种将网页转为可分页的pdf的方法技术

技术编号:40495567 阅读:6 留言:0更新日期:2024-02-26 19:24
本发明专利技术公开了一种将网页转为可分页的pdf的方法,包括:调用浏览器API元素获取工具获取要生成PDF的页面容器DOM元素;计算页面容器的宽高和在页面中的位置信息;创建canvas画布对象,并将画布的宽度高度设置为容器的宽度和高度的两倍;在canvas画布上绘制页面容器,调整页面容器中元素的布局,用空白元素填充页面;导出为分页的pdf,获取插入填充的空白元素并通过浏览器Api移除工具删除所有空白元素,恢复原网页。本方案通过对网页中的内容提前进行处理后再转为分页的PDF,分页的PDF内容更加准确完整,并且可以根据需求动态调整生成的每页PDF的尺寸,可靠性和适应性更强。

【技术实现步骤摘要】

本专利技术涉及网页转换,尤其涉及一种将网页转为可分页的pdf的方法


技术介绍

1、在许多web应用程序中,将网页内容转换为pdf文件,并且将pdf进行分页是一项常见的需求。

2、现有的网页转pdf方法在某些情况下会面临分页不准确的问题,在分页时出现内容被截断的情况,导致pdf生成结果不符合预期。比如:将一个有文字,柱状图等内容的网页转为pdf,会出现文字或者柱状图被截断,上半部分在第一页,下半部分在第二页,导致生成的pdf打印后不符合要求。


技术实现思路

1、本专利技术提出了一种将网页转为可分页的pdf的方法,通过对网页中的内容提前进行处理后再转为分页的pdf,具体技术方案如下。

2、一种将网页转为可分页的pdf的方法,包括以下步骤:

3、步骤s1:调用浏览器api元素获取工具获取要生成pdf的页面容器dom元素;

4、步骤s2:计算页面容器的宽高和在页面中的位置信息;

5、步骤s3:创建canvas画布对象,并将画布的宽度高度设置为容器的宽度和高度的两倍;

6、步骤s4:在canvas画布上绘制页面容器,调整页面容器中元素的布局,用空白元素填充页面;

7、步骤s5:导出为分页的pdf,获取插入填充的空白元素并通过浏览器api移除工具删除所有空白元素,恢复原网页。

8、进一步,所述步骤s2具体包括:通过浏览器api容器宽度和高度信息获取工具获取该容器的宽度和高度,通过浏览器api容器顶部和左端位置信息获取工具获取该容器到文档顶部和左边的距离。

9、进一步,所述步骤s4绘制页面容器具体包括:

10、使用 html2canvas 转换脚本工具将html 网页页面渲染为 canvas画布;

11、获取输入的每页pdf宽度和高度参数;

12、获取canvas 画布的宽度,根据每页pdf高度和宽度参数和canvas 画布的宽度计算出每页展示的html网页内容的高度,并将这个高度定义为每页的标准高度。

13、进一步,所述步骤s4调整页面容器中元素的布局具体包括:

14、通过深度优先遍历算法,遍历容器中的每个子元素,通过子元素高度获取工具得到每个子元素的高度;

15、将子元素的高度和每页的标准高度做比较,若子元素的高度大于等于标准高度,继续递归遍历容器的子元素;若子元素的高度小于每页的标准高度,将子元素的高度进行累加。

16、进一步,所述步骤s4用空白元素填充页面具体包括:

17、将子元素高度每次累加后的和与每页的标准高度作比较,若和小于或者等于标准高度,则继续遍历;

18、若和大于标准高度,则计算出当页的标准高度与累加的和的差值再减去子元素的高度得到一个空白元素的高度值,通过浏览器api创建工具创建一个空白元素,将空白元素的高设置为得到的空白元素的高度值,将空白元素插入到子元素的前面。

19、进一步,所述步骤s5导出为分页的pdf具体包括:

20、调用浏览器api画布宽度和高度获取工具得到 canvas 画布的宽和高;

21、根据输入的每页pdf高度和宽度参数以及canvas 画布的宽度计算出将要导出的pdf的每页宽度和高度;

22、通过画布页面数据获取工具获取页面数据,进行分页计算,通过使用 jspdf 工具将页面导出为分页的pdf文件。

23、本专利技术的有益效果:本专利技术提出了一种将网页转为可分页的pdf的方法,通过对网页中的内容提前进行处理后再转为分页的pdf,这样分页的pdf内容更加准确完整,并且可以根据需求动态调整生成的每页pdf的尺寸(按照a4,a3等纸张的尺寸进行调整)。对比传统方法,可靠性和适应性更强。

本文档来自技高网...

【技术保护点】

1.一种将网页转为可分页的pdf的方法,其特征在于,包括以下步骤:

2.根据权利要求1所述的一种将网页转为可分页的pdf的方法,其特征在于,所述步骤S2具体包括:通过浏览器API容器宽度和高度信息获取工具获取该容器的宽度和高度,通过浏览器API容器顶部和左端位置信息获取工具获取该容器到文档顶部和左边的距离。

3.根据权利要求1所述的一种将网页转为可分页的pdf的方法,其特征在于,所述步骤S4绘制页面容器具体包括:

4.根据权利要求3所述的一种将网页转为可分页的pdf的方法,其特征在于,所述步骤S4调整页面容器中元素的布局具体包括:

5.根据权利要求4所述的一种将网页转为可分页的pdf的方法,其特征在于,所述步骤S4用空白元素填充页面具体包括:

6.根据权利要求1所述的一种将网页转为可分页的pdf的方法,其特征在于,所述步骤S5导出为分页的pdf具体包括:

【技术特征摘要】

1.一种将网页转为可分页的pdf的方法,其特征在于,包括以下步骤:

2.根据权利要求1所述的一种将网页转为可分页的pdf的方法,其特征在于,所述步骤s2具体包括:通过浏览器api容器宽度和高度信息获取工具获取该容器的宽度和高度,通过浏览器api容器顶部和左端位置信息获取工具获取该容器到文档顶部和左边的距离。

3.根据权利要求1所述的一种将网页转为可分页的pdf的方法,其特征在于,所述步...

【专利技术属性】
技术研发人员:张朝森黄武
申请(专利权)人:成都怡康科技有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1