Javascript 如何使用P5.js deviceMoved（）函数按顺序显示文本？

我目前正在尝试制作一个程序，当手机使用P5.JS deviceMoved（）函数移动每两个值时，文本会发生变化。 （下面的gif显示了我希望文本最终随着设备移动而改变的方式）

如下面代码所示，我已经将所有文本放入数组中，我希望每次都将索引更改为+1，比如移动值ads 30，然后重复，直到所有文本都消失

let按钮；
让permissiongrated=false；
设nonios13device=false；
让cx，cy
设值=0；
var myMessages=[“The”，“Quick”，“Brown”，“Fox”，“shopped”，“Over”，“The”，“Lazy”，“Dog”]；
var指数=0；
函数设置（）{
createCanvas（窗口宽度、窗口高度）；
}
函数绘图（）{
背景（255）
文本（myMessages[索引]、宽度/2、高度/2）；
填充（值）；
文本（值、宽度/3、高度/3）；
文本大小（30）
}
功能设备移动（）{
数值=数值+5；
如果（值>255）{
数值=0；
}
}
函数onMove（）{
var currentValue=值+30；
如果（值=当前值）{
索引++；
返回；
}
如果（索引>=myMessages.length）{
指数=0；
}
}

---

有几个问题与

onMove

功能有关。首先也是最重要的一点是，它从未被调用，并且与

deviceMoved

不同，它不是p5.js自动调用的特殊函数。其他问题：

function onMove() {
  // You create a currentValue variable that is just value + 30.
  // Within the same function, checking if value is >= currentValue, 
  // assuming that is what you intended, will be fruitless because it
  // is never true.
  // What you probably want to do is declare "currentValue" as a global
  // variable and check the difference between value and currentValue.
  var currentValue = value + 30;

  // This is the assignment operator (single equal sign), I think you meant
  // to check for equality, or more likely greater than or equal to.
  if (value = currentValue) {
    index++;
    // You definitely do not want to return immediately here. This is where
    // you need to check for the case where index is greater than or equal
    // to myMessages.length
    return;
  }

  if (index >= myMessages.length) {
    index = 0;
  }
}

这里有一个固定版本：

function deviceMoved() {
  value = value + 5;
  if (value > 255) {
    // When value wraps around we need to update currentValue as well to
    // keep track of the relative change.
    currentValue = 255 - value;
    value = 0;
  }

  onMove();
}

let currentValue = 0;
function onMove() {
  if (value - currentValue >= 30) {
    // Update currentValue so that we will wait until another increment of
    // 30 before making the next change.
    currentValue = value;
    index++;

    // We only need to make this check after we've incremented index.
    if (index >= myMessages.length) {
      index = 0;
    }
  }
}

---

为了在我的移动设备（iOS 14）上测试这一点，我必须添加一些代码来请求访问DeviceMotionEvent，并将其托管在使用HTTPS的环境中，而不是嵌入iframe中。您可以查看我的代码并实时运行。

为了将来的参考，最好包含您问题的最小可复制示例。在这种情况下，由于传感器的使用和移动设备的兼容性，最好的方法是提供一个在别处托管的示例。正如你在我的回答中所看到的，我已经使用Glitch.com完成了这项工作。