constructor(_m, _b) {

    this.set(_m, _b);

  }

​

  set(_m, _b) {

    this.m = _m;

    this.b = _b;

    this.pVect = createVector(this.m, -1);

    this.pVectMag = this.pVect.mag();

  }

​

  dist(_x, _y) {

    let Vxy = createVector(_x, _y - this.b);

    let dotProd = this.pVect.dot(Vxy);

    return abs(dotProd) / this.pVectMag;

  }

​

  draw() {

    let y1 = this.m * width + this.b;

    line(0, this.b, width, y1);

  }

}

​

let squaresPerRow = 64;

let spacing;

let myColor;

let myLineG;

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  spacing = width / squaresPerRow;

  myColor = color(220, 20, 120);

  myLineG = new Line(-1, height);

}

​

function draw() {

  background(0);

  noStroke();

​

  for (let y = 0; y < height; y += spacing) {

    for (let x = 0; x < width; x += spacing) {

      let d = myLineG.dist(x, y);

​

      let t = map(d, 0, 0.7 * width, 0, 1, true);

      let c = lerpColor(myColor, color(0), t);

​

      fill(c);

      rect(x, y, spacing + 1);

    }

  }

​

  strokeWeight(4);

​

  stroke(myColor);

  myLineG.draw();

}

​

function mouseMoved() {

  let rise = height / 2 - mouseY;

  let run = width / 2 - mouseX;

​

  // 0.01 avoids division by zero

  let nm = rise / (run + 0.01);

  myLineG.set(nm, mouseY - nm * mouseX);

}

​