cod*_*key 5 html javascript css google-chrome html5-canvas
当我调用context.drawImageChrome 81+ 时，它会自动旋转图像。我想禁用它。我可以在 img 标签中使用 禁用它image-orientation:none，但这在画布上不起作用。
它似乎忽略了图像方向样式。在下面的这个例子中，img 标签不会自动旋转（如预期的那样），但画布会自动旋转，尽管尝试禁用它。
你如何防止drawImage根据 exif 数据旋转，或者至少检测到它已经这样做了？
<html>
<head>
<script>
window.onload = function() {
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
var img = document.getElementById("imgtest");
// This style is ignored
img.style.imageOrientation = 'none';
ctx.drawImage(img, 0, 0);
};
</script>
</head>
<body>
<p>
<img id="imgtest" style="image-orientation:none;" src="portrait.jpg"/>
<canvas id="myCanvas" width="240" height="297"></canvas>
</p>
</body>
</html>
我找到了解决我自己问题的方法。我正在使用 Modernizr.com 的功能检测库来查找浏览器是否会自动旋转图像。
if(Modernizr.exiforientation) {
// Browser does the image rotation
}
我更喜欢一个不需要新库的解决方案，但这是可行的。