canvas - Turn.js が Canvas の画質を乱す

Question

現在、PDF.JS を介して PDF ファイルを読み込み、生成されたキャンバスを Turn.js フリップブックに変換しています。

私のページはこのように生成されます。

    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 を適用し、画像レンダリングをピクセル化に変更して無駄にしようとしました...何が欠けていますか?