pdf.js源码解析-渲染的时序分析

news/2024/10/8 8:33:08

首先来一张总结的图,也就是pdf.js在解析和渲染pdf的一个时序图,下图:

首先要明白,pdf.js在渲染pdf的时候是做分层渲染,也就是时间展现的内容是通过canvas进行绘制的,而我们通过鼠标进行选择时候的内容是通过dom进行普通渲染,也就是 <div>123</div> 这样的普通组件,只是通过设置透明度让内容不直接肉眼可见,但是能够让用户使用鼠标将内容进行选择以及在进行搜索的时候显示背景高亮的。
那么首先来看看在canvas上pdf.js是如果一步步让PDF的内容显示到界面上的:

  • 解析PDF文件内容 initialize方法,是pdf.js中对pdfviewer的各种组件的初始化
  • open方法,是将PDF文件加载解析,将二进制数据读取出来之后构造成PDFDocument对象
  • setDocument通过将解析的PDFDOcument对象设置,进行pdf的pageview的设置
  • 之后通过forceRendering进行渲染PDF的内容,会在渲染进程中render_enqueue中继续渲染内容
  • 调用canvas.js中的方法对内容进行渲染,使用showText等方法将文本绘制到canvas中去
  • 在完成canvas的渲染之后,会继续渲染textLayer的内容
    以上顺序便是一个简单的pdf.js的解析和绘制的顺序,具体的内容可以查看上面时序图,标记了具体的js文件和方法的顺序。
    最后注意一下,由于对部分promise的内容不是理解的特别深入,所以其中的部分顺序可能不一定正确。

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈,一经查实,立即删除!

相关文章

权威SAFe大规模敏捷企业级内训及SAFe敏捷认证

​ SAFe – Scaled Agile Framework是目前全球运用最广泛的大规模敏捷框架,也是成长最快、最被认可、最有价值的规模化敏捷框架,目前全球SAFe认证专业人士已达80万人,福布斯100强的70%都在实施SAFe。本课程是一个2天的 SAFe权威培训课程,在课程中,学员将系统地学习大规模敏…

ping ip、域名、端口

一、pingping baidu.com ping 192.168.9.9 综上所诉,ping命令的时候格式为(注意ping后面需要跟上一个空格) ①ping IP地址或主机域名 ②ping IP地址或主机域名+命令参数 ③ ping 命令参数+IP地址或主机域名 ping命令参数说明查看ping命令帮助 ping /? 输入上面的命令,我们…

探索企业级项目管理的最优策略

企业的项目管理应该采取综合性的方式,结合多种工具和方法来确保项目的成功。zz-plan 甘特图是其中一种非常有用的工具,它可以帮助项目经理和团队成员可视化地展示项目的时间线和进度。以下是采取合适项目管理方式时需要考虑的几个关键点,结合甘特图的使用: 项目规划:在项目…

Redis开源社区持续壮大,华为云为Valkey项目注入新的活力

作为Valkey社区的Technical Steering Committee member,华为云将持续参与社区建设。摘要:作为Valkey社区的Technical Steering Committee member,华为云将持续参与社区建设。一、背景 今年3月21日,Redis Labs宣布从Redis 7.4版本开始,将原先比较宽松的BSD源码使用协议修改…

TigerTrade

目录 老虎国际纳斯达克上市公司 Windows客户端软件 主界面 个股页面,采用左中右方式布局,左侧自选列表,中间图表,右侧是自选和下单器。图表正下方是资产、持仓和订单模块,该模块支持隐藏。持仓和订单闪电下单 闪电下单器,旨在为用户提供更快捷的下单方式闪电下单设置页面…

激光打印机打印唐草纹路流程

一、先弄一张 唐草.png 图片 大概长这样ps 抠图出来 然后 菜单栏 编辑 =》 自由变换 然后导出png 成了这个样子二、 使用 CorelDRAW X4 SP2 精简版 导入这个图 1 菜单栏 位图 =》 转换为 位图 2 菜单栏 位图 =》 轮廓描摹 =》 线条图 大概长这样3 导出为 plt 文件 三、 使用…

【HEVC简介】CTU、CU、PU、TU结构

参考文献:见《High Efficiency Video Coding (HEVC)》Block Structures and Parallelism Features in HEVC章节CTU:coding tree unit,编码树单元,LCU对于YUV=420格式的彩色视频:一个CTU由一个CTB of the luma samples 、2个CTBs of the chroma samples和相关的语法元素组成…

C++内存分布

内存分布 典型的C/C++内存表示有以下几部分构成Text segment,存放代码段和只读常量的区域 Initialized data segment,通常叫做数据段,已经初始化的静态变量和全局变量存放的区域,如static int i = 5、全局变量int j = 10都存放在数据段 Uninitialized data segment(bss),未…