Pdf页面方向和宽度检测

Question

我正在实现pdf.js以便在画布上显示pdf，如下所示。我有2-4页处于横向模式，我需要检测它们并将其相应显示在画布上。

这是我的代码：

 <div class="pdfholder">
      <div id="pdf-container" class="container"></div>
 </div>

脚本：

var loadingTask = PDFJS.getDocument(this.url);
    loadingTask.promise.then(function (pdf) {
        var scale = 1;
        inst.number_of_pages = pdf.pdfInfo.numPages;

        if (window.matchMedia('(max-width: 544px)').matches) {
            scale = 0.3;
        } else if (window.matchMedia('(max-width: 768px)').matches) {
            scale = 0.4;
        } else if (window.matchMedia('(max-width: 992px)').matches) {
            scale = 1.5;
        }


        for (var i = 1; i <= pdf.pdfInfo.numPages; i++) {
            pdf.getPage(i).then(function (page) {
                var viewport = page.getViewport(scale);
                var canvas = document.createElement('canvas');
                document.getElementById(inst.container_id).appendChild(canvas);
                canvas.className = 'pdf-canvas';
                canvas.height = viewport.height;
                canvas.width = viewport.width;
                context = canvas.getContext('2d');

                var renderContext = {
                    canvasContext: context,
                    viewport: viewport
                };
                var renderTask = page.render(renderContext);
                renderTask.then(function () {
                    $('.pdf-canvas').each(function (index, el) {
                        $(el).attr('id', 'page-' + (index + 1) + '-canvas');
                    });
                    inst.pages_rendered++;
                    if (inst.pages_rendered == inst.number_of_pages) inst.initFabric();
                });
            });
        }
    }, function (reason) {
        console.error(reason);
    });

桌面视图：

MobileView：