angular5 - 如何在angular5中的jspdf自动表底部添加文本
问题描述
我在我的 angular5 应用程序中使用 jspdf 自动表。我正在为 jspdf 自动表生成动态数据。我的问题是如何在表格底部添加文本?
const columnHead = [];
const columnRow = [];
this.tableColumns.filter(x => {
columnHead.push(this.capFirstLtr(x.title));
});
this.tableData.filter((x, y) => {
x.slaMetFlag = (this.mapData[y].slaMetFlag ? this.capFirstLtr(this.mapData[y].slaMetFlag) : '-');
columnRow.push([x.date, x.slaMetFlag, x.srType, x.srID, x.srStatus, x.aof, x.ppm, x.deviceID, x.siteID, x.branchID]);
});
const doc = new jsPDF();
doc.text('Showing data from ' + moment(this.requestApi.fromDate).format('MM/DD/YYYY') + ' to ' + moment(this.requestApi.toDate).format('MM/DD/YYYY'), 5, 10);
doc.autoTable(columnHead, columnRow, {
styles: { overflow: 'linebreak', halign: 'center', fontSize: 7},
tableWidth: 200,
margin: 5,
theme: 'grid',
startY: 15,
addPageContent: function(data) {
console.log('data', data);
}
});
doc.save('SR View Export');
}
在上面的代码中,jspdf自动表完成后如何添加文本?
解决方案
如果您想了解有关最后绘制的表格的信息,可以使用 doc.autoTable.previous。它有一个doc.autoTable.previous.finalY属性,其中包含页面上最后打印的 y 坐标值。这可用于在表格之后绘制文本、多个表格或其他内容。
doc.autoTable.previous.finalY
使用这个属性。
doc.autoTable(headers, data);
let finalY = doc.autoTable.previous.finalY;
//页面上的y位置
doc.text(20, finalY, "Hello!")
推荐阅读
- python - 根据 Power BI 中的切片器选择添加或删除视觉对象
- azure - 从 Loki 下载日志
- html - 如何仅在禁用模式下更改 mat-form-field 的背景颜色?
- java - 出于商业目的在哪里发布可用的 maven 存储库中的工件?
- html - 如何将html中的这些内联样式转换为react?
- android - ImageReader.getPlanes() 返回异常:RGBA 覆盖 BLOB 格式缓冲区应具有高度 == 宽度
- java - Java 继承数组
- android - 为什么 Android BroadcastReceiver 不工作?
- flutter - Flutter:如何通过从值中搜索来从列表中获取索引?
- python - 无法加载检查点的数据