Product: Web viewer
Product Version: 10.12.0
Please give a brief summary of your issue:
I have same annotation in database not in document. Now I want to implement the download functionality without loading the web viewer UI.
Please describe your issue and provide steps to reproduce it:
(The more descriptive your answer, the faster we are able to help you)
Please provide a link to a minimal sample where the issue is reproducible:
Hello, Iâm AiRon, an automated tech support bot 
While you wait for one of our customer support representatives, I can help you with your question.
GetPDF API endpoint to convert the document to PDF format and send it to the client for download.Hopefully, this helps you solve your problem while you wait for a human to get back to you.
Hello @rishumishra2001,
Thank you for posting on our forum.
If you are interested in downloading a particular file without using the viewer, see our helpful guide on how to get PDF File data without a viewer here: https://docs.apryse.com/web/guides/get-file-data-without-viewer
Let us know if this works for you!
Best Regards,
Jacob Romano Carlsen
Web Development Support Engineer
Apryse Software Inc.
DownloadPdf: function (documentURL) {
const documentViewer = new Core.DocumentViewer();
console.log(documentViewer);
const extension = âpdfâ;
Core.createDocument(documentURL, { l: Apryse.licenseKey, extension })
.then(doc => {
doc.getFileData().then(data => {
const arr = new Uint8Array(data);
const blob = new Blob([arr], { type: âapplication/pdfâ });
const blobUrl = URL.createObjectURL(blob); // Create a Blob URL
// Open in new tab
window.open(blobUrl, â_blankâ);
});
})
.catch(err => { })
},
I want to use this method to open the document in new tab. Without using instance
initilize: function () {
$(â.activityloaderâ).show();
WebViewer.WebComponent({
path: â/GovBuilt.PlanReview/webviewerâ,
licenseKey: Apryse.licenseKey,
initialDoc: Apryse.pdffilepath,
loadSpinner: false,
annotationUser: this.userId,
compareDefaultLayout: Apryse.compareDefaultLayout,
permissions: Apryse.permissions,
fullAPI: true,
css: â/GovBuilt.PlanReview/css/viewer.cssâ,
}, document.getElementById(Apryse.viewerId))
.then((instance) => {
window.webViewerInstance = instance;
core = instance.Core;
const { documentViewer, annotationManager, Annotations } = instance.Core;
const { Feature } = instance.UI;
const { Color } = Annotations;
const { PDFNet, Tools } = instance.Core;
That why Iâm getting error. Is there any way through which I can use ocument.getElementById(Apryse.viewerId))
.then((instance) => {
window.webViewerInstance = instance; in downloadPdf method
Hello @rishumishra2001,
Thank you for the information.
Iâm not sure I understand your desired workflow. The downloadPdf() API is under our UI namespace and works by downloading the file currently in the viewer. You can find our full guide for saving/downloading a document here: https://docs.apryse.com/web/guides/basics/save
If you are trying to open a document in a new tab, the first code snippet (the one with window.open) should be sufficient.
Please provide the following to investigate further:
Best Regards,
Jacob Romano Carlsen
Web Development Support Engineer
Apryse Software Inc.
DownloadPdf: function (documentURL, contentItemId) {
Apryse.GetAnnotationList(contentItemId);
let hiddenViewer = document.getElementById(âhiddenViewerâ);
if (!hiddenViewer) {
hiddenViewer = document.createElement(âdivâ);
hiddenViewer.id = âhiddenViewerâ;
hiddenViewer.style.display = ânoneâ;
document.body.appendChild(hiddenViewer);
}
WebViewer.WebComponent({
path: '/GovBuilt.PlanReview/webviewer',
initialDoc: documentURL,
licenseKey: licenseKey,
loadSpinner: false,
fullAPI: true,
}, hiddenViewer).then(async (instance) => {
try {
const { documentViewer, annotationManager } = instance.Core;
await documentViewer.loadDocument(documentURL);
const doc = documentViewer.getDocument();
if (Apryse.annotationList && Apryse.annotationList.length > 0) {
for (const annotData of Apryse.annotationList) {
const importedAnnots = await annotationManager.importAnnotationCommand(annotData);
if (importedAnnots.length > 0) {
importedAnnots.forEach((annot) => {
annotationManager.redrawAnnotation(annot);
});
} else {
console.warn("No annotations imported from:", annotData);
}
}
} else {
console.log("No valid annotations to apply.");
}
const xfdfString = await annotationManager.exportAnnotations();
const options = { xfdfString };
const data = await doc.getFileData(options);
const arr = new Uint8Array(data);
const blob = new Blob([arr], { type: 'application/pdf' });
const blobUrl = URL.createObjectURL(blob);
if (!window.openedBlobUrls) {
window.openedBlobUrls = new Set();
}
if (!window.openedBlobUrls.has(blobUrl)) {
window.openedBlobUrls.add(blobUrl);
window.open(blobUrl, '_blank');
}
} catch (error) {
console.error("Error processing PDF:", error);
}
}).catch(error => {
console.error("Error initializing WebViewer:", error);
});
},
I want to open the document in new tab without loading the apryse webviewer UI. Iâm able to load to that but the issue is in note type annotation, when user hover the comment is not visible. I have try official demo site there on hover comment is visible.
Hello @rishumishra2001,
Thank you for the information.
If you would like to use our SDK without having a visible viewer, we would not recommend instantiating WebViewer on an element which has âdisplay: noneâ. You can find out why we donât recommend this here: https://docs.apryse.com/web/guides/best-practices#preload-webviewer
Instead, we recommend running the SDK without the UI. See here for how to do so: https://docs.apryse.com/web/guides/get-started/without-viewer
From there, you can use the guide we previously provided on fetching file data without a viewer in order to implement the download feature desired. You can find that guide here for your convenience: https://docs.apryse.com/web/guides/get-file-data-without-viewer
Let us know if you have any questions about the guides provided.
Best Regards,
Jacob Romano Carlsen
Web Development Support Engineer
Apryse Software Inc.