1.0.22 • Published 2 years ago
@dannadori/hand-pose-detection-worker-js v1.0.22
MediaPipe Hands
API
HandPoseDetectionWorkerManager.init: (config: HandPoseDetectionConfig | null) => Promise<void>
(property) HandPoseDetectionWorkerManager.predict: (params: HandPoseDetectionOperationParams, targetCanvas: HTMLCanvasElement) => Promise<Hand[] | null>
Configuration and Parameter
export const BackendTypes = {
WebGL: "WebGL",
wasm: "wasm",
cpu: "cpu",
} as const;
export const ModelTypes = {
mediapipe: "mediapipe",
tfjs: "tfjs",
tflite: "tflite",
} as const;
export const ModelTypes2 = {
full: "full",
lite: "lite",
old: "old",
} as const;
export interface HandPoseDetectionConfig {
browserType: BrowserTypes;
processOnLocal: boolean;
backendType: BackendTypes;
wasmPaths: { [key: string]: string };
pageUrl: string;
maxHands: number;
iouThreshold: number;
scoreThreshold: number;
modelType: ModelTypes;
modelType2: ModelTypes2;
wasmBase64: string;
wasmSimdBase64: string;
palmModelTFLite: { [key: string]: string };
landmarkModelTFLite: { [key: string]: string };
useSimd: boolean;
maxProcessWidth: number
maxProcessHeight: number
}
export interface HandPoseDetectionOperationParams {
processWidth: number;
processHeight: number;
annotateBox: boolean;
movingAverageWindow: number;
}
Step by step
Create environment and install package
$ npx create-react-app demo --template typescript
$ cd demo/
$ npm install
$ npm install @dannadori/hand-pose-detection-worker-js
Download Model
not needed
Add source image to public.
In this time, the name is "srcImage.jpg"
Edit src/App.tsx
TBD
build and start
$ npm run start
1.0.19
2 years ago
1.0.18
2 years ago
1.0.17
2 years ago
1.0.16
2 years ago
1.0.22
2 years ago
1.0.21
2 years ago
1.0.20
2 years ago
1.0.15
2 years ago
1.0.14
2 years ago
1.0.13
2 years ago
1.0.12
2 years ago
1.0.11
2 years ago
1.0.10
2 years ago
1.0.9
2 years ago
1.0.8
2 years ago
1.0.7
2 years ago
1.0.6
2 years ago
1.0.5
2 years ago
1.0.4
2 years ago
1.0.3
2 years ago
1.0.2
2 years ago