P5js中的多重插值

Question

我试图在p5js中创建多个内插，为此，我尝试在javaScript中重新创建Ben的Integrator类。我意识到从处理到p5js的转换和转换是相当困难的，所以如果这不可能的话，如果您给我一个提示以另一种方式这样做，我将非常感激。谢谢。

以下是我迄今所做的工作。。。

   function Integrator(value, damping, attraction)
{
  this.DAMPING=0.5;
  this.ATTRACTION=0.2;

  this.value;
  this.vel;
  this.accel;
  this.force;
  this.mass=1;

  this.damping=this.DAMPING;
  this.attraction=this.ATTRACTION;

  this.targeting; //boolean
  this.target;

  this.value=value;
  this.damping=damping;
  this.attraction=attraction;

  this.set =function(v)
  {
    this.value=v;
  }

  this.update = function()
  {
    if(this.targeting)
    {
      this.force +=this.attraction *(this.target-this.value);
    }

    this.accel = this.force/this.mass;
    this.vel = (this.vel+this.accel)*this.damping;
    this.value +=this.vel;

    this.force=0;
  }

  this.target = function(t)
  {
    this.targeting=true;
    this.target=t;
  }

  this.noTarget = function()
  {
    this.targeting = false;
  }

}

以下也是Ben Fry http://benfry.com/writing/map/Integrator.pde原始处理代码的链接

Answer 1

将类转换为JavaScript (见下文)相对简单。尽管需要注意的一件事是变量和同名函数，因为在JS中不允许这样做。你可以看到这里的演示

class Integrator {
  
  constructor(value = 100, damping = 0.5, attraction = 0.2) {
    this.force = 0;
    this.vel = 0;
    this.accel = 0;
    this.mass = 1;
    
    this.damping = damping;
    this.attraction = attraction;
    
    this._value = value;
    this._target = value;
  }

  value(v) {
    if (typeof v !== 'undefined') {
      this._value = v;
      return this;
    }
    return this._value;
  }

  update() {
    if (this.targeting) {
      this.force += this.attraction * (this._target - this._value);
    }

    this.accel = this.force / this.mass;
    this.vel = (this.vel + this.accel) * this.damping;
    this._value += this.vel;

    this.force = 0;
  }

  target(t) {
    if (typeof t !== 'undefined') {
      this.targeting = true;
      this._target = t;
      return this;
    }
    return this._target;
  }

  noTarget() {
    this.targeting = false;
  }
}