Skip to content

Latest commit

 

History

History
103 lines (67 loc) · 3.4 KB

File metadata and controls

103 lines (67 loc) · 3.4 KB

中文版

humanseg

A real-time human-segmentation model. You can use it to change background. The output of the model is gray value. Model supplies simple api for users.

Api drawHumanSeg can draw human segmentation with a specified background. Api blurBackground can draw human segmentation with a blurred origin background. Api drawMask can draw the background without human.

version size downloads downloads

Run Demo

  1. Execute in the current directory
npm install
npm run dev
  1. Visit http://0.0.0.0:8866
  2. Visit gpu pipeline http://0.0.0.0:8866/gpu.html

Usage

import * as humanseg from '@paddlejs-models/humanseg';

// load humanseg model, use 398x224 shape model, and preheat
await humanseg.load();

// use 288x160 shape model, preheat and predict faster with a little loss of precision
// await humanseg.load(true, true);

// get the gray value [2, 398, 224] or [2, 288, 160];
const { data } = await humanseg.getGrayValue(img);

// background canvas
const back_canvas = document.getElementById('background') as HTMLCanvasElement;

// draw human segmentation
const canvas1 = document.getElementById('back') as HTMLCanvasElement;
humanseg.drawHumanSeg(data, canvas1, back_canvas) ;

// blur background
const canvas2 = document.getElementById('blur') as HTMLCanvasElement;
humanseg.drawHumanSeg(data, canvas2) ;

// draw the mask with background
const canvas3 = document.getElementById('mask') as HTMLCanvasElement;
humanseg.drawMask(data, canvas3, back_canvas);

gpu pipeline

// 引入 humanseg sdk
import * as humanseg from '@paddlejs-models/humanseg/lib/index_gpu';

// load humanseg model, use 398x224 shape model, and preheat
await humanseg.load();

// use 288x160 shape model, preheat and predict faster with a little loss of precision
// await humanseg.load(true, true);


// background canvas
const back_canvas = document.getElementById('background') as HTMLCanvasElement;

// draw human segmentation
const canvas1 = document.getElementById('back') as HTMLCanvasElement;
await humanseg.drawHumanSeg(input, canvas1, back_canvas) ;

// blur background
const canvas2 = document.getElementById('blur') as HTMLCanvasElement;
await humanseg.drawHumanSeg(input, canvas2) ;

// draw the mask with background
const canvas3 = document.getElementById('mask') as HTMLCanvasElement;
await humanseg.drawMask(input, canvas3, back_canvas);

Online experience

image human segmentation:https://paddlejs.baidu.com/humanseg

video-streaming human segmentation:https://paddlejs.baidu.com/humanStream

Performance

Used in Video Meeting