Skip to main content
Version: 0.12

Render the Movie

You can render your movie to a <canvas> element, stream it with WebRTC or record it to a Blob.

Render to Canvas​

To render your movie to the provided <canvas> element and the movie's audio context, can use the play() method:

movie.play().then(() => {
  console.log("Movie finished playing");
});

Stream​

Use stream() to stream your movie with WebRTC:

movie
  .stream({
    frameRate: 30,
    onStart: (stream: MediaStream) => {
      console.log(`Streaming ${stream.getTracks().length} tracks`);
    },
  })
  .then(() => {
    console.log("Stream reached the end or was interrupted");
  });

Record to Blob​

Use record() to save your movie to a blob:

movie
  .record({
    frameRate: 30,
  })
  .then((blob) => {
    console.log(`Recorded ${blob.size} bytes`);
  });