let handpose;

let predictions = [];

​

function setup() {

  createCanvas(640, 480);

  video = createCapture(VIDEO);

  video.size(width, height);

  video.hide();

​

  // Initialize the handpose model

  handpose = ml5.handpose(video, modelReady);

​

  // Listen to new 'predict' events

  handpose.on('predict', results => {

    predictions = results;

  });

}

​

function modelReady() {

  console.log('Handpose model loaded.');

}

​

function draw() {

  image(video, 0, 0, width, height);

​

  // Draw all the landmarks

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

    const prediction = predictions[i];

    for (let j = 0; j < prediction.landmarks.length; j += 1) {

      const [x, y, z] = prediction.landmarks[j];

      fill(0, 255, 0);

      noStroke();

      ellipse(x, y, 10, 10);

    }

  }

}

​