Javascript html 到 pdf - 删除 table 边框
Javascript html to pdf - remove table borders
我正在摆弄一种方法来构建我的 table(s) 的轻型 pdf 打印件。我有一个输出,但我似乎无法摆脱边界,即使经过大量谷歌搜索和反复试验,我仍然站在我开始的地方。谁知道 pdfmake.js 足以指出我哪里出错了?
var externalDataRetrievedFromServer = [
{ Avdelning: 'First', Namn1: 104.44,Namn2: 78.8, Namn3:83.89,Namn4:25.64,Namn5:20.56},
{ Avdelning: 'Second', Namn1: 66.48,Namn2: 61.59, Namn3:77.41,Namn4:4.89,Namn5:-10.93},
{ Avdelning: 'Third', Namn1: 56.2,Namn2: 46.2, Namn3:56.3,Namn4:10.01,Namn5:-0.09},
{ Avdelning: 'Fourth', Namn1: 77.22,Namn2: 61.41, Namn3:87.72,Namn4:15.81,Namn5:-10.5},
{ Avdelning: 'Fifth', Namn1: 75.78,Namn2: 68.8, Namn3:77.11,Namn4:6.97,Namn5:-1.33},
{ Avdelning: 'Sixth', Namn1: 67.47,Namn2: 47.58, Namn3:81.26,Namn4:19.9,Namn5:-13.79},
{ Avdelning: 'Seventh', Namn1: 94.57,Namn2: 74.21, Namn3:77.16,Namn4:20.35,Namn5:17.41},
{ Avdelning: 'Eighth', Namn1: 62.03,Namn2: 53.95, Namn3:57,Namn4:8.08,Namn5:5.03},
{ Avdelning: 'Ninth', Namn1: 53.89,Namn2: 34.92, Namn3:68.33,Namn4:18.97,Namn5:-14.44},
{ Avdelning: 'Tenth', Namn1: 55.06,Namn2: 36.09, Namn3:52.72,Namn4:18.97,Namn5:2.33}, ];
function buildTableBody(data, columns) {
var body = [];
body.push(columns);
data.forEach(function(row) {
var dataRow = [];
columns.forEach(function(column) {
dataRow.push(row[column].toString());
})
body.push(dataRow);
});
return body;}
function table(data, columns) {
return {
table: {
headerRows: 1,
body: buildTableBody(data, columns),
layout: {hLineColor: function(i, node) {return (i < node.table.body.length) ? 'white' : 'white'; },
vLineColor: function(i, node) { return (i < node.table.widths.length) ? 'white' : 'white';}
}
}
};
}
var dd = {
content: [
{ text: 'Dat:', fontSize: 14, bold: true, margin: [0, 20, 0, 8] },
table(externalDataRetrievedFromServer, ['Avdelning', 'Namn1', 'Namn2', 'Namn3', 'Namn4', 'Namn5'])]
};
$('#download').click(function () {
pdfMake.createPdf(dd).download("test.pdf");
});
经过一些激烈的(更多)测试,我终于找到了问题所在——这是最简单的事情。我在 table 括号内得到了布局部分,它什么也没做(也没有错误消息)。
在这个例子中,我删除了所有边框
function table(data, columns) {
return {
table: {
headerRows: 1,
body: buildTableBody(data, columns)
},
layout: 'noBorders'
};
}
我正在摆弄一种方法来构建我的 table(s) 的轻型 pdf 打印件。我有一个输出,但我似乎无法摆脱边界,即使经过大量谷歌搜索和反复试验,我仍然站在我开始的地方。谁知道 pdfmake.js 足以指出我哪里出错了?
var externalDataRetrievedFromServer = [
{ Avdelning: 'First', Namn1: 104.44,Namn2: 78.8, Namn3:83.89,Namn4:25.64,Namn5:20.56},
{ Avdelning: 'Second', Namn1: 66.48,Namn2: 61.59, Namn3:77.41,Namn4:4.89,Namn5:-10.93},
{ Avdelning: 'Third', Namn1: 56.2,Namn2: 46.2, Namn3:56.3,Namn4:10.01,Namn5:-0.09},
{ Avdelning: 'Fourth', Namn1: 77.22,Namn2: 61.41, Namn3:87.72,Namn4:15.81,Namn5:-10.5},
{ Avdelning: 'Fifth', Namn1: 75.78,Namn2: 68.8, Namn3:77.11,Namn4:6.97,Namn5:-1.33},
{ Avdelning: 'Sixth', Namn1: 67.47,Namn2: 47.58, Namn3:81.26,Namn4:19.9,Namn5:-13.79},
{ Avdelning: 'Seventh', Namn1: 94.57,Namn2: 74.21, Namn3:77.16,Namn4:20.35,Namn5:17.41},
{ Avdelning: 'Eighth', Namn1: 62.03,Namn2: 53.95, Namn3:57,Namn4:8.08,Namn5:5.03},
{ Avdelning: 'Ninth', Namn1: 53.89,Namn2: 34.92, Namn3:68.33,Namn4:18.97,Namn5:-14.44},
{ Avdelning: 'Tenth', Namn1: 55.06,Namn2: 36.09, Namn3:52.72,Namn4:18.97,Namn5:2.33}, ];
function buildTableBody(data, columns) {
var body = [];
body.push(columns);
data.forEach(function(row) {
var dataRow = [];
columns.forEach(function(column) {
dataRow.push(row[column].toString());
})
body.push(dataRow);
});
return body;}
function table(data, columns) {
return {
table: {
headerRows: 1,
body: buildTableBody(data, columns),
layout: {hLineColor: function(i, node) {return (i < node.table.body.length) ? 'white' : 'white'; },
vLineColor: function(i, node) { return (i < node.table.widths.length) ? 'white' : 'white';}
}
}
};
}
var dd = {
content: [
{ text: 'Dat:', fontSize: 14, bold: true, margin: [0, 20, 0, 8] },
table(externalDataRetrievedFromServer, ['Avdelning', 'Namn1', 'Namn2', 'Namn3', 'Namn4', 'Namn5'])]
};
$('#download').click(function () {
pdfMake.createPdf(dd).download("test.pdf");
});
经过一些激烈的(更多)测试,我终于找到了问题所在——这是最简单的事情。我在 table 括号内得到了布局部分,它什么也没做(也没有错误消息)。
在这个例子中,我删除了所有边框
function table(data, columns) {
return {
table: {
headerRows: 1,
body: buildTableBody(data, columns)
},
layout: 'noBorders'
};
}