在Safari中，无法在画布上正确绘制PDF

Question

我正在尝试选择某个图像，然后在画布中显示该部分。 为了了解实际发生的情况，我已将代码简化为一个简单的代码段：

<canvas id="myCanvas" width="400" height="300"></canvas>

(...)

imageObj.onload = function() {
        // draw cropped image
        var sourceX = 0;
        var sourceY = 0;
        var sourceWidth = 200;
        var sourceHeight = 200;
        var destX = 0;
        var destY = 0;
        var destWidth = 200;
        var destHeight = 200;

        context.drawImage(imageObj, sourceX, sourceY, sourceWidth, sourceHeight, destX, destY, destWidth, destHeight);
};

如果我使用实际图像，一切都按预期工作（你可以看到一个jsfiddle here）。

为了获得更高的文本质量，我使用Safari功能，让我给图像标签一个pdf源。但是，当我尝试在画布上绘制相同的部分时，我会渲染一个不同的区域，因为您还可以看到on jsfiddle（需要Safari）

PDF实际上是导出为PDF文件的原始JPG图像（使用Mac的预览版），因此其大小相同。我有不同来源的不同PDF文件的问题，所以这不是我创建PDFS的方式引起的问题。 我在代码中做的唯一更改是将扩展名jpg切换为pdf。

在画布上绘制完整图像效果很好，两个版本都以相同的方式呈现，因此它不像Safari那样无法在画布周期内正确绘制PDF。

有没有其他人遇到过这个问题？有什么我可以做的吗？