let model;

let faces = [];

​

function setup() {

  createCanvas(640, 480, WEBGL);

  video = createCapture(VIDEO);

  video.hide();

  // Load the model

  facemesh.load().then(function(_model){

    model = _model;

  });

}

​

// Detect faces using the video

function detect(){

  model.estimateFaces(video.elt).then(function(_faces){

   faces = _faces; 

  });

}

​

function draw() {

  background(220);

  // Detect faces assuming the model has loaded

  if(model) detect();

  // Move everything to the top-left corner

  // WEBGL draws 0,0,0 in the center of the screen

  push();

  translate(-width/2, -height/2, 0);

  // Make sure video is behind all the face points

  push();

  translate(0, 0, -35);

  image(video, 0, 0);

  pop();

  // Iterate through the faces

  for (let face of faces) {

    //console.log(face);

    let positions = face.scaledMesh;

    //console.log(positions[0]);

    // Each position is stored as an array of 3 numbers 

    // representing the x,y,z position of the mesh point.

    // positions[0] = [35.345, 65.223, 123.11];

​

    strokeWeight(10);

    stroke('white');

    for (let pos of positions) {

      push();

      // Flip the z-coordinate

      translate(pos[0], pos[1], -pos[2]);

      point(0, 0, 0);

      pop();

    }

  }

  pop();

}