Дифференциальное уравнение, описывающее движение маятника
Если вам не нужна большая точность (для первоначального угла 90°), то можно ограничиться таким приближением (приближённым решением уравнения, выдаёт более точные результаты от -20° до 20°, вне пределов с некой погрешностью)
<div class="pendulum"></div>
<style>
.pendulum {
width: 1px;
height: 200px;
background: red;
display: flex;
flex-direction: column;
justify-content: flex-end;
transform-origin: 50% 0;
margin: auto;
}
.pendulum::after {
content: "";
display: block;
width: 10px;
height: 10px;
margin-left: -4.5px;
border-radius: 100%;
background: inherit;
}
</style>
<script>(function loop() {
document.querySelector(".pendulum").style.transform = `rotate(${0.5*Math.PI*Math.cos(Math.sqrt(9.8) * Date.now() / 1000)}rad)`;
requestAnimationFrame(loop);
})();</script>
Если необходимы более точные результаты, воспользуйтесь разложением Фурье...
en.wikipedia.org/wiki/Pendulum_(mathematics) (или просмотрите всю статью)
Графики к упомянутому маятнику
wolframalpha.com