ffmpeg.js icon indicating copy to clipboard operation
ffmpeg.js copied to clipboard

How do you map fontsize from frontend javascript to backend ffmpeg?

Open MittalShruti opened this issue 4 years ago • 0 comments

I am building a simple video editor in react js. For backend, I am using ffmpeg (python)

I need to set the heading font-size for a (say) 1920x1080 (16:9 aspect ratio) resolution video. In react, the video dimensions that I am using are width:515px, height:289.688px. If I set font-size=20pt, how do I ensure that the final video has 'right' (scaled up or down) font size. Pretty sure, I can just pass 20pt to backend to set the font-size; because ffmpeg could produce different width&height video.

That is, in react js, font size - 20px would occupy different space depending upon the width and height of video. But in ffmpeg, once I set the aspect ratio (16:9), fontsize=20px will always occupy same space. Say, I want heading to occupy exactly one line, and fontsize=16px occupies exactly one line in the reactjs video. But same, 16px may not 'finally' occupy exactly one line in the rendered video.

MittalShruti avatar Aug 30 '20 06:08 MittalShruti