第二个文档未显示主要内容，即使在左侧面板中显示内容但不在主 PDFTron 中

Question

I am trying to show side-by-side PDF comparison using the PDFTron library.我正在尝试使用 PDFTron 库显示并排的 PDF 比较。

I am able to show the first comparison successfully however the second comparison does not display as intended and no error was logged in the console.我能够成功显示第一次比较，但是第二次比较没有按预期显示，并且控制台中没有记录错误。

Included libraries包含的库

//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;

Creating an instance and initializing the PDFNet创建实例并初始化 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 event handler for compare button 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 });

        }) 
    }

See the following attached image it is working fine for 1st comparison but for the second comparison is not getting display in the viewer however document loaded event is getting trigger and in the left panel no of pages is displaying but not loading the main content.请参阅下面的附加图像，第一次比较工作正常，但第二次比较没有在查看器中显示，但是文档加载事件正在触发，并且在左侧面板中没有显示页面但没有加载主要内容。

1st Comparison SS:第一次比较 SS：

2nd Comparison SS:第二次比较 SS：

Answer 1

Your code looks correct.您的代码看起来正确。

We are investigating this internally, but you can work around it by disabling the virtual display mode (disableVirtualDisplayMode: true) when instantiating WebViewer.我们正在内部对此进行调查，但您可以通过在实例化 WebViewer 时禁用虚拟显示模式 (disableVirtualDisplayMode: true) 来解决此问题。

Here is the code snippet that worked for me:这是对我有用的代码片段：

<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>

第二个文档未显示主要内容，即使在左侧面板中显示内容但不在主 PDFTron 中

问题描述

1 个解决方案

解决方案1
0 已采纳 2022-05-25 18:24:04

第二个文档未显示主要内容，即使在左侧面板中显示内容但不在主 PDFTron 中

问题描述

1 个解决方案

解决方案1 0 已采纳 2022-05-25 18:24:04

解决方案1
0 已采纳 2022-05-25 18:24:04