现在网上是基本没有能用的开源PDF编辑器的。
我之前打算造一个,但是作为初中生时间和经验都不够多。
但是我自认为找到了一个较为简单的实现路径,自认为只需要用胶水把一些已有开源项目粘在一起,然后做做编辑器UI就差不多了。
纯前端的PDF渲染器开源成熟的基本只有PDF.js
,我去看了一下,渲染在canvas上。猜测原因是canvas和PDF一样,都采用绝对坐标定位。
但是这样做有一个缺点,就是矢量信息丢失。
有趣的是,网上有很多基于canvas的轮子,也就是类似fabricjs、konvajs这类的画布,也有很多基于这些库的开源类画图项目。
所以我在想能不能让PDF.js把页面渲染在这种画布上。
那么接下来是大致主体:
初始化有两个思路方向
编辑器UI:
编辑文本(选择字体,颜色,效果),编辑形状(直线,贝塞尔曲线等),编辑图片(图片阴影等效果),基本上都有现成的。
感觉和比方说FoxitPDFEditor的唯一区别
有一个多行文本合并功能为一个便于富文本编辑。但是也仅限于简单的文本,像数学公式甚至分栏这类也不灵光。
相反的,尽管可能我们懒得实现多行合并,fabricjs这类由于和svg和DOM的高兼容导入性,结合Markdown,KaTeX,Mermaid这样的前端组件基本易如反掌。插入这类内容反而简单。
另:我看了一眼商业编辑器,他们保存也挺花时间而且保存后注释没了,大致说明可能不是直接编辑PDF而是PDF导入编辑器,编辑后导出。
保存PDF:
将画布转为PDF即可,可能有直接的API,没有的话也可以先转SVG(fabricjs是原生支持这这个的)然后转PDF(带矢量信息)。最后可能需要整合注释和书签等。
关于注释
PDF的注释和页面内容不是一个东西,尽管看上去一样,但是注释器有开源的(比如pdf.js viewer)编辑器没有。PDF.js渲染时内容是在一个canvas上,注释是另行处理的。
个人感觉来讲,如果每天有5h,那单页PDF的处理甚至可能只需要1week就能搞完(不用处理书签这种PDF页面间结构和大文件渲染这类懒加载问题)。
另:你可能想要svgcanvas
更新:也可以使用MuPDF实现PDF页面转Svg。但这就是新路线了。