1

How to use react-video-recorder with tensorflow plugin? Using react-webcam doesn`t problem but couldn't use together react-video-recorder and tensorflow.

function VideoRecord() {
  const webcamRef = useRef(null);
  const canvasRef = useRef(null);
 
  const runCoco = async () => {
    const net = await cocossd.load();
    console.log("Handpose model loaded.");
    setInterval(() => {
      detect(net);
    }, 10);
  };
 
  const detect = async (net) => {
    if (
      typeof webcamRef?.current !== "undefined" &&
      webcamRef?.current !== null &&
      webcamRef?.current.video.readyState === 4
    ) {
 
      const video = webcamRef?.current.video;
      const videoWidth = webcamRef?.current.video.videoWidth;
      const videoHeight = webcamRef?.current.video.videoHeight;
 
      webcamRef.current.video.width = videoWidth;
      webcamRef.current.video.height = videoHeight;
 
      canvasRef.current.width = videoWidth;
      canvasRef.current.height = videoHeight;
 
      const obj = await net.detect(video);
 
      const ctx = canvasRef?.current.getContext("2d");
      drawRect(obj, ctx);
    }
  };
 
  useEffect(() => { runCoco() }, []);
 
  return (
    <div className="App">
      <header className="App-header">
        <VideoRecorder
          ref={webcamRef}
 
          className="videoRecord"
          timeLimit={20000}
 
          onRecordingComplete={videoBlob => {
            // Do something with the video...
            console.log('videoBlob', videoBlob);
 
          }}
 
        // timeLimit="15"
        />
 
        <canvas
          ref={canvasRef}
          style={{
            position: "absolute",
            marginLeft: "auto",
            marginRight: "auto",
            left: 0,
            right: 0,
            textAlign: "center",
            zindex: 8,
            width: 640,
            height: 480,
          }}
        />
      </header>
    </div>
  );
}

How to use react-video-recorder with tensorflow plugin? Using react-webcam doesn`t problem but couldn't use together react-video-recorder and tensorflow.

Elchin
  • 39
  • 6

0 Answers0