我正在嘗試使用 PDFTron 庫顯示并排的 PDF 比較。
我能夠成功顯示第一次比較,但是第二次比較沒有按預期顯示,并且控制臺中沒有記錄錯誤。
包含的庫
//included following libraries
<script src="pdftron/lib/webviewer.min.js"></script>
<script src="pdftron/lib/core/webviewer-core.min.js"></script>
<script src="pdftron/lib/core/pdf/PDFNet.js"></script>
var webViewerInstance = null;
var PDFNet = null;
var documentViewer = null;
創建實體并初始化 PDFNet
$(function () {
WebViewer({
fullAPI: true,
path: 'NavResources/Scripts/pdftron/lib'
}, document.getElementById('viewer')).then(async instance => {
webViewerInstance= instance;
PDFNet = instance.Core.PDFNet;
documentViewer = instance.Core.documentViewer;
await PDFNet.initialize();
documentViewer.addEventListener('documentLoaded', () => { webViewerInstance.UI.setLayoutMode(webViewerInstance.UI.LayoutMode.FacingContinuous);
});
})
})
On Click 比較按鈕的事件處理程式
async onClick_comparePDF(file1URL, file2Url) {
instances.UI.closeDocument().then(async x => {
console.log(x);
const newDoc = await PDFNet.PDFDoc.create();
await newDoc.lock();
const doc1 = await PDFNet.PDFDoc.createFromURL(file1URL);
const doc2 = await PDFNet.PDFDoc.createFromURL(file2Url);
await newDoc.appendTextDiffDoc(doc1, doc2);
await newDoc.unlock();
instances.UI.loadDocument(newDoc, { fileName: ccApp.report1 });
})
}
請參閱下面的附加影像,第一次比較作業正常,但第二次比較沒有在查看器中顯示,但是檔案加載事件正在觸發,并且在左側面板中沒有顯示頁面但沒有加載主要內容。
第一次比較 SS:

第二次比較 SS:

uj5u.com熱心網友回復:
您的代碼看起來正確。
我們正在內部對此進行調查,但您可以通過在實體化 WebViewer 時禁用虛擬顯示模式 (disableVirtualDisplayMode: true) 來解決此問題。
這是對我有用的代碼片段:
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" />
<script src='/lib/webviewer.min.js'></script>
<script src="/lib/core/webviewer-core.min.js"></script>
<script src="/lib/core/pdf/PDFNet.js"></script>
</head>
<body style='padding: 0; margin: 0'>
<button id='compareButton'>COMPARE</button>
<div id='viewer'></div>
<script>
WebViewer({
fullAPI: true,
disableVirtualDisplayMode: true,
path: '/lib'
}, document.getElementById('viewer')).then(async instance => {
const { documentViewer, PDFNet, DisplayModeManager } = instance.Core;
const { loadDocument, closeDocument } = instance.UI;
await PDFNet.initialize();
documentViewer.addEventListener('documentLoaded', () => {
instance.UI.setLayoutMode(instance.UI.LayoutMode.FacingContinuous);
});
document.getElementById('compareButton').addEventListener('click', async () => {
const newDoc = await PDFNet.PDFDoc.create();
await newDoc.lock();
const doc1 = await PDFNet.PDFDoc.createFromURL('https://pdftron.s3.amazonaws.com/custom/test/diego/blank.pdf');
const doc2 = await PDFNet.PDFDoc.createFromURL('https://pdftron.s3.amazonaws.com/downloads/pl/demo-annotated.pdf');
await newDoc.appendTextDiffDoc(doc1, doc2);
await newDoc.unlock();
loadDocument(newDoc);
})
})
</script>
</body>
</html>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/481827.html
標籤:javascript pdf 网络 pdftron
