我正在使用jsPDF
创建一个包含PDF
张图像的20
。主要代码执行以下操作:
let data = await this.i2b_promise_func("http://localhost:3000/" + imgURL);
let url64 = data.base64;
jsPdfDoc.addImage(url64, 'PNG', x, y, width, height);
因此,我成功获取了基数为64的字符串并将其提供给jsPDF
对象,但是当我运行jsPdfDoc.save('new_pdf.pdf')
时,我得到了错误:
未捕获的RangeError:无效的字符串长度
我尝试仅使用img
选择d3
元素,并将此img
元素提供给addImage()
jsPDF
而不是base64字符串,但是它给出了同样的错误。我将图像添加到几个for
循环中。
所有代码(带有img
元素d3
的检索)显示如下:
addNewImage(chartType, jsPdfDoc, chartId, width, numImg) {
let x = 5, y = 20;
//console.log(imgURL);
numImg = numImg + 1;
let imgElem = d3.select(chartId).node();
let ratio = imgElem.height / imgElem.width;
let height = ratio*width;
if (numImg % 2 === 0) {
x = width + 15;
}
if (numImg > 2) {
y = height + 20;
} else if (numImg > 8) {
jsPdfDoc.addPage();
numImg = 1;
x = 5;
y = 20;
}
// Somehow the first page images should be drawn differently
if (chartType === this.chartTypes[0]) {
console.log(width);
console.log(height);
//let base64Img = this.getBase64Image(imgElem, width, height);
//let data = this.i2b_promise_func("http://localhost:3000/" + imgURL);
//console.log(data);
jsPdfDoc.addImage(imgElem, 'PNG', x, y, width, height);
} else {
console.log(width);
console.log(height);
//let base64Img = this.getBase64Image(imgElem, 4*width, 4*height);
//let data = this.i2b_promise_func("http://localhost:3000/" + imgURL);
//console.log(data);
jsPdfDoc.addImage(imgElem, 'PNG', x, y, width, height);
}
return numImg;
}
saveAsPDF() {
//let imgElem = this.refs['chart_0_0'];
//console.log(imgElem.src);
var doc = new jsPDF();
let width = 80;
let numImg = 0;
for (let typeIdx = 0; typeIdx < this.chartTypes.length; typeIdx++) {
let chartType = this.chartTypes[typeIdx];
console.log(chartType);
doc.text(chartType, 90, 10);
let urlArr = this.get_analysis_charts(chartType);
for (let chartIdx = 0; chartIdx < urlArr.length; chartIdx++) {
let pathArr = urlArr[chartIdx];
// If the last differentially expressed genes charts are drawn
if (chartType === this.chartTypes[this.chartTypes.length - 1]) {
for (let idx = 0; idx < pathArr.length; idx++) {
let imgURL = pathArr[idx];
let chartId = '#chart_' + typeIdx + '_' + chartIdx + '_' + idx;
numImg = this.addNewImage(chartType, doc, chartId, width, numImg);
console.log('numImg');
console.log(numImg);
}
} else {
let chartId = '#chart_' + typeIdx + '_' + chartIdx;
numImg = this.addNewImage(chartType, doc, chartId, width, numImg);
console.log('numImg');
console.log(numImg);
}
}
doc.addPage();
numImg = 0;
}
doc.save('new_pdf.pdf');
}