
Recherche avancée
Autres articles (67)
-
Le profil des utilisateurs
12 avril 2011, parChaque utilisateur dispose d’une page de profil lui permettant de modifier ses informations personnelle. Dans le menu de haut de page par défaut, un élément de menu est automatiquement créé à l’initialisation de MediaSPIP, visible uniquement si le visiteur est identifié sur le site.
L’utilisateur a accès à la modification de profil depuis sa page auteur, un lien dans la navigation "Modifier votre profil" est (...) -
Configurer la prise en compte des langues
15 novembre 2010, parAccéder à la configuration et ajouter des langues prises en compte
Afin de configurer la prise en compte de nouvelles langues, il est nécessaire de se rendre dans la partie "Administrer" du site.
De là, dans le menu de navigation, vous pouvez accéder à une partie "Gestion des langues" permettant d’activer la prise en compte de nouvelles langues.
Chaque nouvelle langue ajoutée reste désactivable tant qu’aucun objet n’est créé dans cette langue. Dans ce cas, elle devient grisée dans la configuration et (...) -
XMP PHP
13 mai 2011, parDixit Wikipedia, XMP signifie :
Extensible Metadata Platform ou XMP est un format de métadonnées basé sur XML utilisé dans les applications PDF, de photographie et de graphisme. Il a été lancé par Adobe Systems en avril 2001 en étant intégré à la version 5.0 d’Adobe Acrobat.
Étant basé sur XML, il gère un ensemble de tags dynamiques pour l’utilisation dans le cadre du Web sémantique.
XMP permet d’enregistrer sous forme d’un document XML des informations relatives à un fichier : titre, auteur, historique (...)
Sur d’autres sites (7438)
-
Cohort Analysis 101 : How-To, Examples & Top Tools
13 novembre 2023, par Erin — Analytics Tips -
Segmentation Analytics : How to Leverage It on Your Site
27 octobre 2023, par Erin — Analytics Tips -
ffmpeg command to add moving text watermark to video [closed]
13 octobre 2023, par Imran Khan

// Constants for watermark movement, direction change intervals, fade intervals, and overlap duration
 const MOVE_SPEED = 3;
 const DIRECTION_CHANGE_MIN = 3000;
 const DIRECTION_CHANGE_MAX = 6000;
 const FADE_INTERVAL_MIN = 10000;
 const FADE_INTERVAL_MAX = 20000;
 const OVERLAP_DURATION = 2000;

 // Get references to the video container and watermarks
 const container = document.querySelector('.video-container');
 const watermark1 = document.getElementById('watermark1');
 const watermark2 = document.getElementById('watermark2');

 // Helper function to get a random integer between min and max (inclusive)
 function getRandomInt(min, max) {
 return Math.floor(Math.random() * (max - min + 1)) + min;
 }

 // Helper function to get a random direction (either 1 or -1)
 function getRandomDirection() {
 return Math.random() > 0.5 ? 1 : -1;
 }

 // Set the initial position of the watermark inside the video container
 function setInitialPosition(watermark) {
 const x = getRandomInt(0, container.offsetWidth - watermark.offsetWidth);
 const y = getRandomInt(0, container.offsetHeight - watermark.offsetHeight);
 watermark.style.left = `${x}px`;
 watermark.style.top = `${y}px`;
 watermark.style.opacity = 1;
 }

 // Function to handle continuous movement of the watermark
 function continuousMove(watermark) {
 let dx = getRandomDirection() * MOVE_SPEED;
 let dy = getRandomDirection() * MOVE_SPEED;

 // Inner function to handle the actual movement logic
 function move() {
 let x = parseInt(watermark.style.left || 0) + dx;
 let y = parseInt(watermark.style.top || 0) + dy;

 // Check boundaries and reverse direction if necessary
 if (x < 0 || x > container.offsetWidth - watermark.offsetWidth) {
 dx = -dx;
 }
 if (y < 0 || y > container.offsetHeight - watermark.offsetHeight) {
 dy = -dy;
 }

 // Apply the new position
 watermark.style.left = `${x}px`;
 watermark.style.top = `${y}px`;

 // Continue moving
 setTimeout(move, 100);
 }

 move();

 // Change direction at random intervals
 setInterval(() => {
 const randomChoice = Math.random();
 if (randomChoice < 0.33) {
 dx = getRandomDirection() * MOVE_SPEED;
 dy = 0;
 } else if (randomChoice < 0.66) {
 dy = getRandomDirection() * MOVE_SPEED;
 dx = 0;
 } else {
 dx = getRandomDirection() * MOVE_SPEED;
 dy = getRandomDirection() * MOVE_SPEED;
 }
 }, getRandomInt(DIRECTION_CHANGE_MIN, DIRECTION_CHANGE_MAX));
 }

 // Handle the fading out of the old watermark and fading in of the new watermark
 function fadeOutAndIn(oldWatermark, newWatermark) {
 setTimeout(() => {
 setInitialPosition(newWatermark);
 newWatermark.style.opacity = 1;
 }, 0);

 setTimeout(() => {
 oldWatermark.style.opacity = 0;
 }, OVERLAP_DURATION);

 // Continue the cycle
 setTimeout(() => fadeOutAndIn(newWatermark, oldWatermark), getRandomInt(FADE_INTERVAL_MIN, FADE_INTERVAL_MAX));
 }

 // Initialize the watermarks
 setInitialPosition(watermark1);
 continuousMove(watermark1);
 setTimeout(() => fadeOutAndIn(watermark1, watermark2), getRandomInt(FADE_INTERVAL_MIN, FADE_INTERVAL_MAX));
 continuousMove(watermark2);



body, html {
 height: 100%;
 margin: 0;
 font-family: Arial, sans-serif;
 display: flex;
 justify-content: center;
 align-items: center;
 background-color: #eee;
 }

 .video-container {
 width: 50vw;
 height: 50vh;
 background-color: black;
 position: relative;
 overflow: hidden;
 }

 .watermark {
 font-size: 22px;
 position: absolute;
 color: white;
 opacity: 0;
 transition: opacity 2s;
 }





 
 
 


 <div class="video-container">
 <span class="watermark">watermark</span>
 <span class="watermark">watermark</span>
 </div>
 









I am trying to achieve an animation effect using ffmpeg. I am adding text watermark to an input video and animate the text diagonally, horizontally or vertically changed randomly. Here is what I have achieved so far.


ffmpeg -i video.mp4 -c:v libx264 -preset veryfast -crf 25 -tune zerolatency -vendor ap10 -pix_fmt yuv420p -filter:v "drawtext=fontfile=./fonts/Roboto/Roboto-Light.ttf:text='Watermark':fontcolor=white:alpha=0.5:fontsize=60:y=h/10*mod(t\,10):x=w/10*mod(t\,10):enable=1" -c:a copy watermark.mp4


Here is what I want it to work.


Initial Position :
The watermark randomly placed in the video the first time they appear.


Continuous Movement :
The watermark continuously moves within the video.
The direction and speed of the watermark's movement are random. It can move diagonally, purely horizontally, or purely vertically.
When the watermark reaches the boundaries of the video, it bounces back, changing its direction.


Direction Change :
During its continuous movement, the watermark will suddenly change its direction at random intervals between 3 to 6 seconds.
When changing direction, the watermark can randomly determined move diagonally, purely horizontally, or purely vertically.


Fade In and Out :
Every 10 to 20 seconds (randomly determined), the current watermark begins to fade out.
As the old watermark starts to fade out, a new watermark fades in at a random position, ensuring that there's always a visible watermark on the screen.
These two watermarks (the fading old one and the emerging new one) overlap on the screen for a duration of 2 seconds, after which the old watermark completely disappears.
These patterns and characteristics together provide a dynamic, constantly moving, and changing watermark for the video


To achieve the result I think we can use the
drawtext
multiple times. I have attached the HTML and JavaScript variant just for the reference to understand the result but I am trying to do this using ffmpeg.