Я транслирую свою камеру «окружающей среды» на элемент видео в моем DOM, используя navigator.mediaDevices.getUserMedia.Проблема в том, что на моем тестовом устройстве (Samsung Tab) это видео кажется растянутым.Во время моих тестов я не использую никаких ограничений, кроме FaceMode: «Environment».У меня нет этой проблемы на моем мобильном устройстве.
Я уже пытался установить ограничения ширины и высоты, это работает, только если я статически устанавливаю значения своей камеры планшета, но мое приложение должно поддерживать все устройства.Примечание: мое приложение заблокировано для портрета.Создано для Android с использованием Cordova.
// потоковое кодирование
setup() {
const constraints = {
video: {
facingMode: "environment",
//tablet
//width: {min:1280, ideal: width},
//height: {min:720, ideal: height}
},
audio: false
};
navigator.mediaDevices.getUserMedia(constraints)
.then(function (s) {
video.srcObject = s;
video.play();
})
.catch(function (err) {
console.log("An error occured! " + err);
});
if(!this.get('streaming')) {
video.addEventListener("canplay", function () {
_this.set('videoReady', true);
_this.processMedia();
}, false);
}
}
processMedia() {
let _this = this;
let video = document.getElementById('videoInput');
if (!this.get('streaming')) {
video.width = video.videoWidth;
video.height = video.videoHeight;
this.placeIndicators(video.width, video.height);
}
//process functionality//
}
Ожидаемое поведение: получить видео элемент с потоком камеры моего окружения с правильным соотношением сторон на всех устройствах.
Фактическое поведение: на моем планшете мой видеопоток «растягивается, когда устройство удерживается в альбомной ориентации, и« сжимается », когда держится портрет