有没有办法让WebGL/THREE.js将视频DOM元素读入YUV纹理？

const videoElement = document.createElement('video');
navigator.mediaDevices.getUserMedia({ video: true })
  .then((stream) => {
    videoElement.srcObject = stream;
    videoElement.play();
  })
  .catch((error) => {
    console.error('Error accessing video stream:', error);
  });

const canvasElement = document.createElement('canvas');
canvasElement.width = videoElement.videoWidth;
canvasElement.height = videoElement.videoHeight;
const context = canvasElement.getContext('2d');

function render() {
  context.drawImage(videoElement, 0, 0, canvasElement.width, canvasElement.height);
  const dataUrl = canvasElement.toDataURL();

  const loader = new THREE.TextureLoader();
  loader.load(dataUrl, (texture) => {
    // 在这里可以将texture应用到场景中的物体上
    // ...
  });

  // 渲染下一帧
  requestAnimationFrame(render);
}

render();