画布Iphone 13 pro上的图像亮度

Question

我正在尝试从手机相机获取图像到画布，以便稍后保存。

我的问题是当我使用iPhone 13 Pro时，画布上的图像比它应该的更亮。这个问题只发生在iPhone 13 Pro上，其他ios和android手机没有这个问题。

这是我如何传递视频流到画布

let video = document.createElement('video');
let canvas = document.getElementById('canvas');
let ctx = container.getContext('2d');
navigator.mediaDevices.getUserMedia({
audio: false,
video: {
width: 1920,
height: 1020,
facingMode: 'environment'
}}).then(stream => {
window.stream = stream;
video.srcObject = stream;
const track = stream.getVideoTracks()[0];
video.setAttribute('playsinline', 'true');
video.play();
requestAnimationFrame(() => {

ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
});
})

<video>元素中的图像保持正常亮度(iPhone 13 pro)

图片来自iphone 13 pro

图片来自android手机

Answer 1

这是getUserMedia中width: 1920, height: 1020,参数的问题。我把它删除了，现在它可以正常工作了。