iOS HTML5画布drawImage垂直缩放错误，即使是*小*图像？
底部的代码应该绘制图像的裁剪部分，保持纵横比 然而，在iOS 6和iOS 7上，它只在iPadMini和iPadRetina上进行了尝试，垂直挤压图像 我知道在处理大图像时，这是一个已知的iOS6错误，但这似乎在小图像上也会发生，所讨论的图像只有669 x 500，而在iOS7上 乍一看，我可以通过不裁剪图像来解决这个问题，但在画布上设置一个剪切矩形，然后通过缩放和旋转绘制完整的图像，反向平移图像，但我不知道这是否始终有效 此外，我注意到当比例因子大于0.5时，问题不会发生，因此这确实表明，再次是苹果的子采样算法导致了这种比例问题。请注意，如果图像大小非常重要，它在669x500上失败，但令人惊讶的是它在670x500上工作！似乎任何奇数宽度都会失败，偶数宽度也可以 有人能解决这个问题吗？我们可以使用megapix图像js库，但由于我们需要绘制许多小图像，这将是相当缓慢的 谢谢， 彼得iOS HTML5画布drawImage垂直缩放错误，即使是*小*图像？,ios,canvas,scaling,drawimage,Ios,Canvas,Scaling,Drawimage,底部的代码应该绘制图像的裁剪部分，保持纵横比 然而，在iOS 6和iOS 7上，它只在iPadMini和iPadRetina上进行了尝试，垂直挤压图像 我知道在处理大图像时，这是一个已知的iOS6错误，但这似乎在小图像上也会发生，所讨论的图像只有669 x 500，而在iOS7上 乍一看，我可以通过不裁剪图像来解决这个问题，但在画布上设置一个剪切矩形，然后通过缩放和旋转绘制完整的图像，反向平移图像，但我不知道这是否始终有效 此外，我注意到当比例因子大于0.5时，问题不会发生，因此这确实表明，再次
我在JSFIDLE上添加了代码：似乎在drawImage之前添加以下代码会以某种方式“修补”iOS画布渲染器：context.save；context.scale1e6，1e6；context.drawImageimg，0,0,1e-7,1e-7,0,0,1e-7,1e-7；语境恢复；现在对你有用吗？因为我也有同样的经历issue@Ziriax我也遇到了同样的问题，但是在drawImage之前运行代码并不能解决这个问题。你能让它正确地画出来吗？@Rhummy：我们目前正在使用来解决这个错误。它可以处理大多数情况，但不是所有情况。
<html>
<body>
Left and right image should be the same, but on iOS, the left image is vertically squeezed
<br/>
<canvas id="canvas" width="980" height="709"></canvas>
</body>
<script>
var img = document.createElement('img');
img.onload = function () {
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
// The scaling problem does not occur when scale is larger than 0.5
var scale = 0.4;
// Cropping it this way does not work on iOS, but works on all other browsers
context.drawImage(img, 0, 0, 500, 500, 0, 0, 500 * scale, 500 * scale);
// Cropping the image using a clipping rect seems to do the job on iOS, but might be slower.
context.beginPath();
context.rect(400, 0, 500 * scale, 500 * scale);
context.clip();
context.drawImage(img, 0, 0, img.width, img.height, 400, 0, img.width * scale, img.height * scale);
};
// The problem occurs for 669x500, it works for 670x500!
img.src = "http://lorempixel.com/669/500/";
</script>
</html>