Please help, trying to setup BodyPix library from ml5.js, couldn't resolve this TypeError issue, learning and following tutorial here. Thank you.
Reference Material: Dan shiffman Tutorial (https://www.youtube.com/watch?v=jKHgVdyC55M) Official Sketch Example (https://github.com/ml5js/ml5-library/blob/main/examples/p5js/BodyPix/BodyPix_Webcam_Parts/sketch.js)
let video;
let poseNet;
let pose;
let skeleton;
let bodyPix;
let segmentedImage;
function setup() {
createCanvas(640, 480);
background(255);
video = createCapture(VIDEO, videoReady);
video.size(640, 480);
video.hide();
segmentedImage = createImage(640, 480);
poseNet = ml5.poseNet(video, modelLoaded);
poseNet.on('pose', gotPoses);
}
function videoReady() {
console.log('video ready');
bodyPix = ml5.bodyPix(video, modelReady);
}
function modelReady() {
console.log('bodypix ready');
bodyPix.segmentWithParts(gotResult);
}
function gotResult(error, result) {
if (error) {
console.log(error);
return;
}
console.log(result);
segmentedImage = result.partMask; //set result here, default: result.image
bodyPix.segmentWithParts(gotResult);
}
function modelLoaded() {
console.log('poseNet ready');
}
function gotPoses(poses) {
//console.log(poses);
if (poses.length > 0) {
pose = poses[0].pose; //could add in confidence filter here.
skeleton = poses[0].skeleton;
}
}
function draw() {
background(255);
// image(video, 0, 0);
// if (pose) {
// let eyeR = pose.rightEye;
// let eyeL = pose.leftEye;
// let d = dist(eyeR.x, eyeR.y, eyeL.x, eyeL.y);
// noStroke();
// fill(0);
// ellipse(pose.nose.x, pose.nose.y, d/2);
// if(pose.rightWrist.x < 640 && pose.rightWrist.y < 480) {
// fill(0, 0, 255);
// ellipse(pose.rightWrist.x, pose.rightWrist.y, 20);
// }
// if(pose.leftWrist.x < 640 && pose.leftWrist.y < 480) {
// fill(0, 0, 255);
// ellipse(pose.leftWrist.x, pose.leftWrist.y, 20);
// }
// for (let i = 0; i < pose.keypoints.length; i++) {
// let x = pose.keypoints[i].position.x;
// let y = pose.keypoints[i].position.y;
// fill(255);
// if(x < 640 && y < 480) {
// ellipse(x, y, 12);
// }
// }
// for (let i = 0; i < skeleton.length; i++) {
// let a = skeleton[i][0];
// let b = skeleton[i][1];
// stroke(255);
// strokeWeight(2);
// line(a.position.x, a.position.y, b.position.x, b.position.y);
// }
// } //end if statement
image(segmentedImage, 0, 0);
} //end drawLoop