如何获得类似模数模式的正弦曲线

Question

我正在尝试使用 javascript 在我的网站上制作漂亮的上下动画，但我需要这样的序列：

0 1 2 3 4 3 2 1 0 1 2 3 4 ...

但是我倾向于用于重复操作的模块只给我：

0 1 2 3 4 0 1 2 3 4 0 1 2 ...

如何获得圆形图案，例如从 i++ 变量。

例如，我尝试应用正弦波。

Answer 1

你可以这样做：

"use strict"
for (let i=0;i<20;i+=0.25) { // step size
  console.log(
    Math.round( //integers only
      Math.abs( //positives
        Math.sin(i)*4 //sin goes from 0 to 1, so if your peak is 4...
      )
    )
  );
}

Answer 2

你好像要的是三角波。试试这个：

var period = 8,
    amplitude = 4;

for (var i = 0; i < 50; i++) {
  console.log(
    amplitude * Math.abs(
      2*(i/period - Math.floor(i/period + 1/2))
    )
  )
}

这是一个使用模运算符的版本：

var period = 8,
    amplitude = 4;

for (var i = 0; i < 50; i++) {
  console.log(
    (2 * amplitude/period) * (
      Math.abs(((i + period/2) % period) - period/2)
    )
  )
}

这两者的工作原理都是可以通过取锯齿波的绝对值来创建三角波。在第一个中我们使用 Math.floor 创建锯齿波，在第二个中我们使用 %.

如何获得类似模数模式的正弦曲线

How to get a sinus like modulo pattern

javascript

math

modulo