在 header pdf 上并排导出两个图像

Export two images side by side on header pdf

我一直在使用 this plugin 获取数据 table 并导出 Excel 和 PDF 文件。我的问题来自 PDF 文件导出,我想在 header 页面上并排添加两个图像,但我得到的唯一结果是一个图像在一行中,另一个在下一行,这是我的一部分代码:

                 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);
                    }
                }

这是结果:

此致

要根据需要将图像添加到页眉,我建议您执行以下操作:

  • pageMargins 属性添加到 doc
  • 使用 docheader 属性添加图像。

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