javascript – 如何用fillColor填充pdfmake的列背景颜色?
作者:互联网
有没有选项用fillColor填充列背景颜色:’#dedede’?
fillColor非常适用于tablecell,同时它不适用于列:(
<script src="https://rawgit.com/bpampuch/pdfmake/master/build/vfs_fonts.js"></script>
<script src="https://rawgit.com/yelouafi/pdfmake/master/build/pdfmake.js"></script>
<script>
function print(argument) {
// open the PDF in a new window
pdfMake.createPdf(docDefinition).open();
}
</script>
<button onclick="print()" style="display:block; margin: 10px auto;padding: 20px 50px;">Print</button>
<hr>
<script>
var docDefinition = {
content: [
'This paragraph fills full width, as there are no columns. Next paragraph however consists of three columns', {
columns: [{
// auto-sized columns have their widths based on their content
width: 'auto',
text: 'First column',
fontSize: 30,
fillColor: '#dedede'
}, {
// star-sized columns fill the remaining space
// if there's more than one star-column, available width is divided equally
width: '*',
text: 'Second column'
}, {
// fixed width
width: 100,
text: 'Third column'
}, {
// percentage width
width: '10%',
text: 'Last column'
}],
// optional space between columns
columnGap: 10
},
'This paragraph goes below all columns and has full width'
]
};
</script>
解决方法:
我还没有将背景颜色应用于列.我认为你唯一的选择是使用表格.
在这一行下面,我附上了一个简单的代码,你可以直接在pdfmake playground粘贴,以便尝试.
祝好运!
var dd = {
content: [
'This paragraph fills full width, as there are no columns. Next paragraph however consists of three columns',
{
style: 'section',
table: {
widths: [ '15%', '*', '35%'],
body: [
[
{
text: 'first column',
fillColor: '#555555',
color: '#00FFFF',
},
{
text: 'second column',
color: '#555555',
fillColor: '#dedede'
},
{
text: 'third column',
fillColor: '#555555'
}
]
]
},
layout: 'noBorders'
}
],
styles: {
section: {
fontSize: 9,
color: '#FFFFFF',
fillColor: '#2361AE',
margin: [0, 15, 0, 5]
}
},
defaultStyle: {
alignment: 'center'
}
}
标签:javascript,pdf,pdf-generation,pdfmake 来源: https://codeday.me/bug/20190609/1205752.html