PDF.JS PDF无法正确呈现，显示为镜​​像且倒置

Question

我正在尝试使pdf.js在IE中工作。我已经从{。{3}}的pdf.js网站上的“使用base64编码的PDF的Hello World”示例中几乎完全复制了该代码。 PDF上下颠倒并已镜像。我环顾四周，常见的原因是将画布重新用于多个渲染，但是我没有这样做，只是渲染一次，所以我真的不知道。

在我的html文档顶部，我有：

$html .= '<canvas width="600px" height="2000px" id="the-canvas"></canvas>';

然后我基本上就是从演示中完全复制了JS，就像这样（encodedString变量是我的pdf base64字符串）

        var pdfData = atob(encodedString);

        // Loaded via <script> tag, create shortcut to access PDF.js exports.
        var pdfjsLib = window['pdfjs-dist/build/pdf'];

        // The workerSrc property shall be specified.
        pdfjsLib.GlobalWorkerOptions.workerSrc = '//mozilla.github.io/pdf.js/build/pdf.worker.js';

        // Using DocumentInitParameters object to load binary data.
        var loadingTask = pdfjsLib.getDocument({data: pdfData});
        loadingTask.promise.then(function(pdf) {
            console.log('PDF loaded');

            // Fetch the first page
            var pageNumber = 1;
            pdf.getPage(pageNumber).then(function(page) {

                console.log('Page loaded');

                var scale = 1.5;
                var viewport = page.getViewport({scale: scale});

                // Prepare canvas using PDF page dimensions
                var canvas = document.getElementById('the-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
                };

                var renderTask = page.render(renderContext);
                renderTask.promise.then(function () {
                    console.log('Page rendered');
                });

            });
        }, function (reason) {
            // PDF loading error
            console.error(reason);
        });

我真正改变的唯一一件事是我注释了几行基于视口设置画布宽度和高度的行，因为它不能正常工作，总是被折叠，所以我在画布html内联指定了宽度和高度。 / p>

我似乎无法在图像中包含这种新的堆栈溢出设计，但是pdf正在呈现并出现，但是其上下颠倒且文本已镜像，就像您在镜子中查看文本一样。

如果有人可以给我建议，我将不胜感激。谢谢

Answer 1

更改{scale：scale}进行缩放。它想要一个数字而不是一个对象。示例文档是错误的。

Answer 2

<块引用>

方法签名在 PR #10369 中发生了变化，因此：

<块引用>

在 2.0.943 及更早版本中，它采用“常规”参数，即 格式为 getViewport(scale、rotate、dontFlip)。

<块引用>

在 2.1.266 及更高版本中，它需要一个对象，即格式化为 getViewport({ 缩放，旋转，dontFlip })

来源： https://github.com/mozilla/pdf.js/pull/10369

公关： dependency injection