2

I need to export the fabric js canvases(I have more than one) in an mp4 file with the same animation between each with some transitions.

I don't find anything related to this on the internet. My frontend is in angular and the backend is in node.js.

The canvases are rendering properly. I can even export them in images.

Any help is highly appreciated.

O. Jones
  • 103,626
  • 17
  • 118
  • 172
Dinesh Rawat
  • 970
  • 10
  • 32
  • Have you tried using the [captureStream](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/captureStream) API with the [MediaRecorder](https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder) API? – O. Jones Oct 05 '20 at 11:12
  • I tried MediaRecorder that seems to be working fine for canvases having animation. But in my case, it is not mandatory to have animated canvases. I want to support recording even without animation. – Dinesh Rawat Oct 05 '20 at 11:38
  • How about this approach? https://superuser.com/questions/1189610/convert-series-of-pngs-into-mp4-video-using-ffmpeg-where-each-photo-is-1-frame You'll need a machine running ffmpeg. Or maybe obsproject.com ? There's nothing built into browsers or canvases to generate motion pictures from still pictures other than MediaRecorder. You don't have to animate the canvases you use with captureStream(). – O. Jones Oct 05 '20 at 11:52
  • This approach is really nice. I tried that too, it works like a charm. But I have a UI where users can customize the text and images. – Dinesh Rawat Oct 05 '20 at 12:07

0 Answers0