Demos
Demos
Try our demos and get inspired with what you can do with body-segmentation models!
Table of Contents
Live Camera Demo
This demo uses your camera to get live stream and segments the detected people in real-time. You can try out different runtimes to see the difference. It works on laptops, iPhones and android phones.
MediaPipe SelfieSegmentation model entry
Upload a Video Demo
This demo allows you to upload a video (in .mp4 format) to run with the model. Once the video is processed, it automatically downloads the video with segmentation.
MediaPipe SelfieSegmentation model entry
How to Run a Demo
If you want to run any of the demos locally, follow these steps:
-
Go to the demo folder, e.g.
cd live_video
-
Remove cache etc.
rm -rf .cache dist node_modules
-
Build dependency.
yarn build-dep
-
Install dependencies.
yarn
-
To ensure GPU sync for a correct mediapipe FPS, edit
./node_modules/@mediapipe/selfie_segmentation/selfie_segmentation.js
as well as./node_modules/@mediapipe/pose/pose.js
and after the statementy=d.l.getContext("webgl2",{});
add the statementwindow.exposedContext=y;
. This will give the demo access to this context. If you skip the step then the demo will work but the FPS for mediapipe will be incorrect. -
Run the demo.
yarn watch
-
The demo runs at
localhost:1234
. (Remember to provide URL model parameter e. g.localhost:1234/?model=mediapipe_hands
)