html5 캔버스에 여러 동영상이 있습니까?

Question

저는이 미디어 프로젝트를 만들고 있습니다. 큰 문제가 있습니다. 필자는 본질적으로 16x4 크기의 4x4 격자를 원했지만 물론 지연 문제가 발생했습니다. 캔버스로이 작업을 수행하는 더 좋은 방법이 있는지 궁금합니다. 여러 개의 동영상을 합성 할 수 있습니까? 16 개의 동영상 요소가있는 것과 달리 속도가 빨라 집니까? 이 링크를 클릭하면 : http://graysonearle.com/bluemen/ 왼쪽의 PLAY ALL (테스트 후, 나중에)을 누르면 내 말을 알 수 있습니다. 그것은 실제로 대부분의 경우 작동하지만 때로는 그렇지 않습니다. 또한 더 긴 비디오를 추가 할 예정입니다. 모든 조언을 주시면 감사하겠습니다.

Answer 1

16 개의 동영상을 개별적으로 렌더링하는 대신 전체적으로 하나의 동영상을 만드는 것을 방지해야한다는 요구 사항이 있습니까? 여기

Answer 2

매우 늦게 대답 만 간다 :

당신은 물론 JS 하나 개의 캔버스 요소에 여러 개의 비디오 요소를 렌더링 할 수 있습니다. 비디오는 기본적으로 이미지로 처리되므로 각 RAF 프레임에 대해 비디오를 렌더링 할 수 있습니다.

ctx.drawImage(YourVidID, 0, 0, 100, 100); 
ctx.drawImage(YourVidID2, 100, 100, 200, 200); 
etc...