Estoy ejecutando un reloj SVG analógico hacia atrás como un temporizador de cuenta regresiva y quiero que las manecillas giren en respuesta a dos funciones diferentes. Un tic rápido cada 1/3 de segundo y luego una "sincronización de tiempo" cada 12 segundos para corregir cualquier desviación.
Las variables "minutos" y "segundos" se utilizarán en la propiedad animateTransform de las manos.
Declaré "segundos" y "minutos" globalmente, pero solo la función sincronizar () los está alcanzando. La función freewheelin() no lo actualiza. Obtengo "NaN" mostrando segundos en esa función. El temporizador en sí está en línea ahora , pero no puedo configurar las manos con el script actual, por lo que espero que este script lo haga funcionar.
Sé que esto es una sintaxis tonta, pero me está ganando.
// Set the date we're counting down to var countDownDate = new Date("May 17, 2022 21:22:05").getTime(); minutes = 0, seconds = 0, ms = 0; // Update the count down every 12 seconds function synch() { // Get today's date and time var now = new Date().getTime(); // Find the distance to count down var distance = countDownDate - now; // Time calculations for , hours, minutes and seconds var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); var seconds = Math.floor((distance % (1000 * 60)) / 1000); var ms = new Date(now).getMilliseconds(); // Output the result in an element with id="demo" document.getElementById("demo").innerHTML = minutes + "m " + seconds + "s " + ms; // If the count down is over, write some text if (distance < 0) { clearInterval(x); document.getElementById("demo").innerHTML = "EXPIRED"; } return minutes, seconds, ms; }; setInterval(synch, 12000); synch(); function freewheelin() { document.getElementById("unsynched").innerHTML = seconds; seconds = seconds - 0.333333 }; setInterval(freewheelin,333);