// (would this work directly in px?)

​

let data = [];

​

// general formula for a line: y = mx + b

// ( Gottfried learned this as y = kx + d)

​

let m = 1;  // this is called the "slope" or "gradient"

let b = 0;  // this is called the "intercept"

​

function setup() {

  createCanvas(400, 400);

}

​

function draw() {

  background(0);

​

  for (let i=0; i < data.length; i++) {

    let x = map(data[i].x, 0, 1, 0, width);

    let y = map(data[i].y, 0, 1, height, 0);

    fill(255);

    noStroke();

    ellipse(x, y, 6, 6);

  }

  drawLine();

}

​

function mousePressed() {

  let point = {

    x: map(mouseX, 0, width, 0, 1),

    y: map(mouseY, 0, height, 1, 0)

  };

  data.push(point);

  linearRegression();

}

​

function drawLine () {

  // from the left side of the canvas

  let x1 = 0;

  let y1 = m * x1 + b;

  // to the right side

  let x2 = 1;

  let y2 = m * x2 + b;

​

  // convert them to pixels

  x1 = map(x1, 0, 1, 0, width);

  y1 = map(y1, 0, 1, height, 0);

  x2 = map(x2, 0, 1, 0, width);

  y2 = map(y2, 0, 1, height, 0);

  stroke(0, 0, 255);

  line(x1, y1, x2, y2);

}

​

function linearRegression() {

  // sum up all the x and y values

  let sum_x = 0;

  let sum_y = 0;

  for (let i=0; i < data.length; i++) {

    sum_x += data[i].x;

    sum_y += data[i].y;

  }

  // to calculate their average

  let avg_x = sum_x / data.length;

  let avg_y = sum_y / data.length;

​

  // this is following the formula for calculating m & b:

​

  let num = 0;  // the numerator part of our division

  let den = 0;  // the denominator part of our division

  for (let i=0; i < data.length; i++) {

    let x = data[i].x;

    let y = data[i].y;

    num += (x - avg_x) * (y - avg_y);

    den += (x - avg_x) * (x - avg_x);

  }

  m = num / den;

  b = avg_y - m * avg_x;

}