I’m currently working on a video editor and there is a feature where you can select a gif from Giphy and overlay it on top of your video after a header transition.
With FFmpeg you can manipulate, combine, add effects with filters. There is a filter called overlay
- that we can use.
This did not work as I expected:
To apply a filter after a certain amount of time we'll use the option enable
(this option allows for timeline editing).
The below script overlays the gif.mp4 on top of main_video.mp4 during the 1 - 3 seconds duration.
ffmpeg -i main_video.mp4 -i gif.mp4 -filter_complex
“[0:v][1:v]overlay=enable='between(t,1,3)'[out]”
-map [out] complete.mp4
** [0:v]
--> first video (main_video.mp4)
** [1:v]
--> the second video (gif.mp4)
** [out]
--> first and second video combined into one after the overlay.
Problem: gif.mp4 will start playing from the beginning so after 1 second has passed the gif video will be 1 second in already.
Solution:
Use the setpts
filter to delay the overlay video (gif.mp4) start with x seconds.
ffmpeg -i main_video.mp4 -i gif.mp4 -filter_complex
“[1:v]setpts=PTS-STARTPTS+1/TB[delayedGif];
[0:v][delayedGif]overlay=enable='between(t,1,3)'[out]”
-map [out] complete.mp4
The setpts filter evaluates its expression and assigns the value as the timestamp for the current frame it is processing. For a detailed explanation check out this awesome post.
For setpts=PTS-STARTPTS+1/TB
:
** +1
is the time in seconds we want to delay our offset
** TB is the timebase.
Too see the gif-overlay in action check out Glitterly - a web based video editor I've been working on.
I'm constantly posting more FFmpeg tips and tricks on Twitter (and happy to answer any questions!) - @AhlrothOskar.
Top comments (2)
Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks, Thanks
I would love if you can provide the codesandbox along with the solution.