在PDFKit中旋转文本有什么技巧吗？

Question

我正在使用PDFKit.org通过JavaScript生成PDF.

文档是不言自明的,但我面临一个未解决的问题,我猜一些StackOverflow成员可能已经找到了一个技巧.

我必须在某个时刻旋转文本,文档只解释如何旋转形状(如a rect()).

我已经尝试了几件事,但到目前为止它们都没有.

所以我正在寻找通过调整代码来旋转它的方法,或者也许你们中的一些人可以向我展示我可能错过的文档的一部分？

Answer 1

没有特别的技巧,但正确理解如何在PDFKit中应用转换至关重要.

要理解的主要是您不要旋转文本或形状:旋转文档,如隐含的那样doc.rotate(...).rect(...).

它可能会帮助您将文档视为具有物理属性的画布.它的一个属性是它的旋转.
如果要在纸张上绘制旋转文本,您可能会做的是物理旋转页面,然后像往常一样水平写入一些文本,然后将页面旋转回正常状态.
你最终得到的是一个直页上的旋转文本:

这正是PDFKit的工作原理:在文档上应用转换,绘制在此转换后的上下文中绘制所需的所有内容,并将文档设置为先前的状态.

要实现这一目标,您有两种方法:doc.save()和doc.restore().

• 使用save() 前,应用变换,从而不会影响之前一直得出的一切.
• 然后,您可以转换画布并绘制所需内容
• 一旦绘制了需要转换的所有内容,请调用restore()将文档放回其初始状态.它基本上将回滚最近一次save()调用后执行的所有转换(即旋转,缩放,转换).

要(有点)重现你要做的上图:

doc.text('text', ...)
doc.save()
doc.rotate(90).text('rotated text', ...)
doc.restore()

最后要理解的是,文档的坐标系统受到转换的影响:

因此,如果text是在坐标处绘制的(0, 0),那么rotated text就是绘制了类似的东西(0, documentHeight / 2 - offset).
使用90度旋转倍数时很容易处理,但你必须使用三角测量法否则:)

为方便起见,您可以使用旋转原点进行播放,以确保围绕对下一个绘图有意义的点旋转文档!

Answer 2

编写旋转文本的最佳方法是围绕某个点（您希望文本的起点）旋转 pdf，然后编写它并将 pdf 文档旋转回来。代码示例：

doc.rotate(angle, { origin: [x,y] });
doc.text( 'TEST', x, y);
doc.rotate(angle * (-1), { origin: [x,y] });

这样你就不需要计算一个新的位置。

另外值得知道的是 pdfkit 将我们文本的 x 和 y 作为我们文本“框”的左上角（在我的情况下确实很重要）。