let PY = 0

let PZ = 0

let bound = 100

let V

​

function setup() {

  createCanvas(400, 400, WEBGL);

  angleMode(DEGREES)

  campos(10, 90-5, 300)

  V = createVector(0, 0, 0)

}

​

function campos(az, pl, r) {

  let v = p5.Vector.fromAngles(radians(pl), radians(az), r)

  stroke("black")

  camera(v.x, v.y, v.z)

}

​

function axis(s) {

  stroke("green")

  line( -s,  0,  0,  s,  0,  0)

  line(  0, -s,  0,  0,  s,  0)

  line(  0,  0, -s,  0,  0,  s)

}

​

function draw() {

  strokeWeight(1)

  background("white");

  axis(bound)

  noFill()

  stroke("gray")

  box(2*bound)

  strokeWeight(5)

  PX = mouseX - width/2

  PY = mouseY - height/2

  if( abs(PX) > bound || abs(PY) > bound || abs(PZ) > bound)

    stroke("yellow")

  else

    stroke("red")

  point(PX, PY, PZ)

  stroke("green")

  point(PX, 0, 0)

  point(0, PY, 0)

  point(0, 0, PZ)

  strokeWeight(1)

  stroke(0)

  translate(V.x, V.y, V.z)

  box(10)

}

​

function mouseWheel(event) {

  PZ -= event.delta;

}

​

function mouseClicked() {

  V.x = PX;

  V.y = PY;

  V.z = PZ;

}