Comments (1)
In the meantime, it is possible to merge multiple PDF documents into a single document using third-party libraries. The following demo shows how to merge two surveys using the pdf-lib library: View Demo.
import React from "react";
import { SurveyPDF } from "survey-pdf";
import "survey-core/defaultV2.min.css";
import "./index.css";
import { json3, json4, data3, data4 } from "./json";
import { PDFDocument } from "pdf-lib";
async function mergePdfs(pdfsToMerges) {
const mergedPdf = await PDFDocument.create();
const actions = pdfsToMerges.map(async (pdfBuffer) => {
const pdf = await PDFDocument.load(pdfBuffer);
const copiedPages = await mergedPdf.copyPages(pdf, pdf.getPageIndices());
copiedPages.forEach((page) => {
//page.setWidth(210);
mergedPdf.addPage(page);
});
});
await Promise.all(actions);
const mergedPdfFile = await mergedPdf.save();
// Convert ArrayBuffer to Blob
const mergedPdfBlob = new Blob([mergedPdfFile], { type: "application/pdf" });
// Create a URL for the Blob
const mergedPdfUrl = URL.createObjectURL(mergedPdfBlob);
// Create a download link
const downloadLink = document.createElement("a");
downloadLink.href = mergedPdfUrl;
downloadLink.download = "merged.pdf";
// Append the download link to the body and click it programmatically
document.body.appendChild(downloadLink);
downloadLink.click();
// Clean up by removing the download link and revoking the URL
document.body.removeChild(downloadLink);
URL.revokeObjectURL(mergedPdfUrl);
}
async function createSurveyPdfModel(surveyJsons, responses) {
let options = {
fontSize: 14,
margins: {
left: 10,
right: 10,
top: 10,
bot: 10,
},
format: [210, 297],
};
const surveyPDF1 = new SurveyPDF(surveyJsons[0], options);
surveyPDF1.data = responses[0];
const surveyPDF2 = new SurveyPDF(surveyJsons[1], options);
surveyPDF2.data = responses[1];
// Load PDF documents and wait for both to be loaded
const [pdf1Content, pdf2Content] = await Promise.all([
loadPDFContent(surveyPDF1),
loadPDFContent(surveyPDF2),
]);
if (pdf1Content && pdf2Content) {
await mergePdfs([pdf1Content, pdf2Content]);
} else {
console.error("Error: One or both PDF buffers are empty.");
}
}
async function loadPDFContent(surveyInstance) {
try {
const blob = await surveyInstance.raw("blob");
const reader = new FileReader();
reader.readAsArrayBuffer(blob);
return await new Promise((resolve, reject) => {
reader.onload = () => {
resolve(reader.result);
};
reader.onerror = reject;
});
} catch (error) {
console.error("Error loading PDF content:", error);
return null;
}
}
function SurveyPdfComponent() {
return (
<button
onClick={() => createSurveyPdfModel([json3, json4], [data3, data4])}
>
Export Merged Surveys
</button>
);
}
export default SurveyPdfComponent;
//...
export const json3 = {
title: "Sample Survey 1",
mode: "display",
pages: [
{
name: "page1",
elements: [
{
type: "boolean",
name: "question1",
},
],
},
],
};
export const json4 = {
title: "Sample Survey 2",
mode: "display",
pages: [
{
name: "page1",
elements: [
{
type: "boolean",
name: "question2",
title: "My Survey",
},
],
},
],
};
export const data3 = {
question1: true,
};
export const data4 = {
question2: false,
};
from survey-pdf.
Related Issues (20)
- Signature Pad - Signatures are not exported to PDF when applyImageFit: true HOT 2
- Signature: Background image is not exported to PDF
- Export to PDF with markdown crashes on empty lines HOT 1
- Exporting NoUISlider in read-only mode results in an error
- Boolean rendered as Checkbox doesn't display a label in PDF HOT 1
- [jQuery] A question title placeholder doesn't work in a multi-page survey
- failed build on server HOT 2
- Accessibility? HOT 1
- Single-Choice Matrix - Introduce a renderer which prints a filled-in rectangle instead of a radio button within a cell HOT 1
- HTML Rendering Issues HOT 4
- Add an option to override a Checkbox check or and Matrix check option HOT 1
- A colon appears in the next line for single-line input fields which is placed within a row HOT 1
- Cannot create property 'objectFit' on string 'XXX.jpg' when overriding File Question rendering using the onRenderQuestion event HOT 1
- The 'Uncaught (in promise): TypeError: Cannot read properties of undefined (reading 'render')' exception is thrown when running custom PDF brick rendering using the TextFieldBrick HOT 1
- An image preview doesn't appear when a File Upload is nested within a Dynamic Panel
- Render smilies in the rating question
- [Node.js] File Upload - The image overlaps subsequent form fields
- PDF Generator properties are visible in Survey Creator if both the libraries are included within a web page
- license key activation
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from survey-pdf.