使用Safari中的HTML5画布在iOS 7下的iPhone 5C上垂直压缩图像

Question

我开发了一个移动网络应用程序，允许用户使用移动设备相机拍照，然后将其显示在HTML5画布上。在iOS 7下的iPhone 5C上运行此Web应用程序时，图像严重垂直压扁，因此它看起来扭曲并占据了大约20％的画布而不是按预期的100％。

这可能与Safari图像子采样有关，这也导致早期版本的iOS和其他设备上的垂直压缩，尽管不像上面的问题那样糟糕。创建了一个名为megapix-image.js的jquery插件来解决这个问题，它可以在运行iOS 6的iPhone4和iPad上运行，以纠正这种垂直压扁，从而使图像正确显示。 megapix-image.js似乎与iPhone 5 / iOS 7不兼容（它不会转换图像文件）。

需要注意的是，iOS 7完全纠正了iPhone 4上出现的垂直压扁问题，但它显然使iPhone 5 / 5C上的问题更加严重。

这个问题有解决方案吗？

解决方案：

<script type="text/javascript" src="~/Scripts/megapix-image.js"></script> 
<script>

var mpImg = new MegaPixImage(file);
var mpImg.render(srcImage, {maxWidth: 960, maxHeight: 960});
</script>

其中file是fileInput控件中的文件，srcImage是更正后的图像

Answer 1

我发现megapixel-image.js适用于iPhone 5和iOS 7.我发现我正在调用一些参数不正确。该插件可以纠正垂直压扁问题。