How to extract keypoints from BodyPix model in React? - reactjs

Question

I need help on this matter. I am trying to extract the keypoints from BodyPix to be saved in a JSON file. I can see the keypoints in the console whenever I inspect it from the browser. I also want to save the keypoints into an array or a variable maybe so that I can use it throughout the code. Thank you very much. Here's the code:
function App() {
const bodyPixProperties = {
architecture: 'MobileNetV1',
outputStride: 16,
multiplier: 0.75,
quantBytes: 4
};
const runBodysegment = async () => {
const net = await bodyPix.load(bodyPixProperties);
console.log("BodyPix model loaded.");
// Loop and detect hands
setInterval(() => {
detect(net);
}, 100);
};
const detect = async (net) => {
// Check data is available
if (
...
const person = await net.segmentPersonParts(video, {
flipHorizontal: false,
internalResolution: 'medium',
segmentationThreshold: 0.7
});
console.log(person);
// const coloredPartImage = bodyPix.toMask(person);
const coloredPartImage = bodyPix.toColoredPartMask(person);
const opacity = 0.7;
const flipHorizontal = false;
const maskBlurAmount = 0;
const canvas = canvasRef.current;
bodyPix.drawMask(
canvas,
video,
coloredPartImage,
opacity,
maskBlurAmount,
flipHorizontal
);
}
};
runBodysegment();