Turn.js弄乱了我的画布上的图像质量

Question

我目前正在通过PDF.JS加载PDF文件并将生成的画布转换为Turn.js flipbooks

我的网页就是这样生成的。

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

        // Prepare canvas using PDF page dimensions
        var pag1 = document.getElementById('pag1');
        var context1 = pag1.getContext('2d');
        pag1.height = viewport.height;
        pag1.width = viewport.width;
        var renderContext = {
            canvasContext: context1,
            viewport: viewport
        };
        page.render(renderContext);
    });

并且像这样应用了转弯

$(window).ready(function() {
    $('#magazine').turn({
        display: 'single',
        acceleration: true,
        gradients: !$.isTouch,
        elevation:50,
        when: {
            turned: function(e, page) {
                /*console.log('Current view: ', $(this).turn('view'));*/
            }
        }
    });
});

非常基本的东西，但我不明白为什么会发生这种情况：

我尝试更改比例，应用imageSmoothingEnabled：false，并将图像渲染更改为像素化无效...我缺少什么？