[英]Javascript - imageCapture.takePhoto() function to take pictures
[英]How to change size in imageCapture.takePhoto()?
我需要从 imageCapture.takePhoto() 更改照片的大小,但它不起作用。我需要将大小更改为 320 高 X 240 宽,但结果是 640 高 X 480 宽。
在这里你可以找到文档。 https://developer.mozilla.org/en-US/docs/Web/API/ImageCapture/takePhoto
navigator.getUserMedia(
{
video:true,
audio:true
},
function(localMediaStream) {
const track = localMediaStream.getVideoTracks()[0];
let imageCapture = new ImageCapture(track);
imageCapture.takePhoto(
{imageHeight:320,imageWidth:240}).then(function(blob) {
//do somethingh with blob (photo)
}).catch(function(error) {
console.log(error);
});
},
function(err) {
console.log(err);
});
看来你需要能够使用photoSettings ImageCapture.takePhoto(photoSettings)的参数前要检查你的ImageCapture中的PhotoCapabilities。
要做到这一点,你就会调用getPhotoCapabilities()
你ImageCapture中的方法,然后检查设置范围imageHeight
和imageWidth
。
const capture = new ImageCapture(track);
const { imageWidth, imageHeight } = await capture.getPhotoCapabilities();
const width = setInRange(required_width, imageWidth);
const height = setInRange(required_height, imageHeight);
const photoSettings = (width && height) ? {
imageWidth: width,
imageHeight: height
} : null;
const pic = await capture.takePhoto(photoSettings);
function setInRange(value, range) {
if(!range) return NaN;
let x = Math.min(range.max, Math.max(range.min, value));
x = Math.round(x / range.step) * range.step; // take `step` into account
return x;
}
https://jsfiddle.net/bLrvyet5/
但是很可能您所需的宽度和高度不在这些MediaSettingsRange 中,因此您可能必须自己在画布上调整此图像的大小。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.