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

Question

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

文档非常明显，但我面临一个未解决的问题，我猜一些StackOverflow成员可能已经找到了一个技巧。

我必须在某个时刻旋转文本，文档只解释如何旋转形状（如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作为我们文本的左上角＆＃34; box＆＃34; （这在我的案例中确实很重要。）

Answer 3

我把头发拉了一下，回答了这个问题或事实。尝试了许多事情，但文字总是以自己的方式结束。

这是我用来以不同方向放置文本的小剪辑。 此函数在旋转坐标系中计算新的x和y。

var doTransform = function (x, y, angle) {
var rads = angle / 180 * Math.PI;
var newX = x * Math.cos(rads) + y * Math.sin(rads);
var newY = y * Math.cos(rads) - x * Math.sin(rads);

return {
    x: newX,
    y: newY,
    rads: rads,
    angle: angle
    };
};

然后这个经历了x，y，旋转的文本数组。 Uncerscore用于循环。

var drawTexts = function (doc, texts) {

_.each(texts, t => {
    doc.save();
    doc.fontSize(t.size);
    var loc = doTransform(t.x, t.y, t.rotation);        
    doc.rotate(t.rotation);        
    doc.text(t.text, loc.x, loc.y);               
    doc.restore();
    });

};

首先是＆＃39;世界＆＃39;旋转，然后文本被放置到新的（x，y），这是与（t.x，t.y）相同的点，但在旋转的世界中。

Answer 4

您可以使用svg。参见https://pdfmake.github.io/docs/document-definition-object/svgs/

pdfmake为此使用svg-to-pdfkit。

源中似乎支持

transform =“ rotate ....”，请参见https://github.com/alafr/SVG-to-PDFKit/blob/master/source.js#L431：

    } else if (func === 'rotate' && nums.length === 3) {
      let a = nums[0] * Math.PI / 180;
      result = multiplyMatrix(result, [1, 0, 0, 1, nums[1], nums[2]], [Math.cos(a), Math.sin(a), -Math.sin(a), Math.cos(a), 0, 0], [1, 0, 0, 1, -nums[1], -nums[2]]);
    }