在标题pdf上并排导出两个图像

Question

我一直在使用this plugin 制作数据表并导出 Excel 和 PDF 文件。我的问题来自 PDF 文件导出，我想在页眉并排添加两个图像，但我得到的唯一结果是一个图像在一行中，另一个在下一行，这是我的代码的一部分：

                 customize: function (doc) {
                    
                    if (doc) {
                        doc.content.splice(0, 0, [{
                            margin: [0, 0, 0, 0],
                            alignment: 'left',
                            image: 'base64_Image',
                            width: 100,
                            height: 40,
                        },{
                            margin: [0, 0, 0, 0],
                            alignment: 'right',
                            image: 'base64_Image',
                            width: 100,
                            height: 40,
                        }]);

                        console.log(doc);
                    }
                }

结果如下：

问候

Answer 1

要根据需要将图像添加到标题中，我建议您执行以下操作：

• 将pageMargins 属性添加到doc
• 使用doc 的header 属性添加图像。

并排 2 张图片

customize: function (doc) {
    doc.pageMargins = [40, 80, 40, 60]
    doc.header = [
        {
            margin: 10,
            columns: [
                {
                    image: 'base64_Image',
                    width: 100,
                    height: 40,
                    padding: 10
                },
                {
                    image: 'base64_Image',
                    width: 100,
                    height: 40,
                }
            ],
            columnGap: 10 // optional space between columns
        },
    ]
    return doc
}

如果你想要一个在左边的图像和一个在标题右边的图像，你只需要在header 中添加columns 属性的调整值。试试这样：

customize: function (doc) {
    ...
    doc.header = [
        {
            ...
            columns: [
                {
                    image: imageBase64,
                    width: 100,
                    height: 40,
                    padding: 10
                },
                {
                    width: '*',
                    text: ''
                },
                {
                    image: imageBase64,
                    width: 100,
                    height: 40,
                }
            ],
        },
    ]
}

示例代码here