我该如何使用Chrome网络摄像头API和操纵视频processing.js?(How can i

2019-09-23 11:43发布

作为话题,我想用网络摄像头和摄像头铬API玩就派上用场了,不需要插件。

不过,我不熟悉JavaScript语法,所以我还是想用processing.js操纵视频。 因此,代码应该怎么是这样?

在画布GetUserMedia,然后呢? 我怎么能告诉processing.js有在画布上的视频?

进口processing.video不应该工作,因为它是processing.js代替处理。

Answer 1:

根据这样的: https://github.com/austinhappel/webcam-processingjs/blob/master/js/webcam-processing.js ,你需要调用摄像头的方法,如:

ctx.drawImage(myImg, imageOffset, 0, height / width * nb, nb);

从那里,你可以手动操纵画布上的像素

p.loadPixels();
imgPixelData = p.pixels.toArray();

他们在这里提供一个摄像头类调用getUserMedia: https://github.com/austinhappel/webcam-processingjs/blob/master/js/webcam.js

关键线路在这里:

if (navigator.getUserMedia) {
  navigator.getUserMedia({video: true}, function (stream) {
    self.video.src = stream;
    self.localMediaStream = stream;
  }, onWebcamFail);
} else if (navigator.webkitGetUserMedia) {
  navigator.webkitGetUserMedia({video: true}, function (stream) {
    self.video.src = window.webkitURL.createObjectURL(stream);
    self.localMediaStream = stream;
}, onWebcamFail);

祝好运! 我只在Java中做到了这一点,所以让我们知道,如果你的JavaScript和网络摄像头发挥好。 我想你需要铬的最新建立任何的这个工作。



文章来源: How can i use chrome webcam API and the processing.js to manipulate the video?