PDF.jsのドキュメントはランダムに上下逆さまに表示されます

Question

私は自分のポリマーアプリケーションにPDFファイルを表示するためにPDF.jsアドオンを使用しています。時折、pdfコンテンツは上下逆さまにレンダリングされます。ここで私はPDF.jsをどのように使用していますか：

  downloadPdf: function(item) { 
       var pdfJsInitParams = { 
        url: app.baseURL + item.report_pdf, 
        httpHeaders: app.user.token 
       }; 

       PDFJS.getDocument(pdfJsInitParams).promise.then(function(pdf) { 
        function renderPage(pageNumber, eltId) { 
         if(pdf.numPages < pageNumber) { 
          return; 
         } 

         pdf.getPage(pageNumber).then(function(page) { 
          var scale = 1.3; 
          var viewport = page.getViewport(scale); 

          // Prepare canvas using PDF page dimensions 
          var canvas = document.getElementById(eltId); 
          if(canvas) { 
           var context = canvas.getContext('2d'); 
           canvas.height = viewport.height; 
           canvas.width = viewport.width; 

           // Render PDF page into canvas context 
           var renderContext = { 
            canvasContext: context, 
            viewport: viewport 
           }; 
           page.render(renderContext); 
          } 
         }).catch(function(err) { 
          showToastWithText(err, 'error'); 
         }); 
        } 

        renderPage(1, 'report_1'); 
        renderPage(2, 'report_2'); 
       }); 
      } 

この問題の原因は何ですか？

Answer 1

（downloadPdfが短期間に複数回呼び出されたように見えます）

レンダリング（）操作は非同期であり、あなたが同じキャンバス上に新しいレンダリングを開始する前にhttps://github.com/mozilla/pdf.js/blob/master/examples/learning/prevnext.htmlを参照してください、その完了を待つ必要があります例。待機したくない場合は、新しいキャンバスを作成してください。