Mediapipe วิเคราะห์ข้อมูลจากภาพและวิดีโอแบบเรียลไทม์ แถมใช้งานบนเว็บได้ด้วย
Mediapipe เป็นไลบรารีของ Google ที่ช่วยในการทำงานเกี่ยวกับการรู้จำและวิเคราะห์ข้อมูลจากภาพและวิดีโอแบบเรียลไทม์ โดยมีความสามารถหลากหลาย เช่น การติดตามใบหน้า การรู้จำท่าทางมือ และการตรวจจับวัตถุ เป็นต้น
การใช้งานเบื้องต้น
- ฟีเจอร์อื่น ๆ:
- Pose: การติดตามท่าทางของร่างกาย
- Hand Tracking: การติดตามมือและการวิเคราะห์การเคลื่อนไหว
- Objectron: การตรวจจับวัตถุสามมิติ
ใช้งานการติดตามใบหน้า: นี่คือตัวอย่างการใช้ Mediapipe สำหรับติดตามใบหน้าในวิดีโอ:
import cv2
import mediapipe as mp
# Initialize MediaPipe Face Detection
mp_face_detection = mp.solutions.face_detection
face_detection = mp_face_detection.FaceDetection(min_detection_confidence=0.2)
mp_drawing = mp.solutions.drawing_utils
# Start capturing video
cap = cv2.VideoCapture(0)
while cap.isOpened():
ret, frame = cap.read()
if not ret:
continue
# Convert the BGR image to RGB
rgb_frame = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB)
results = face_detection.process(rgb_frame)
# Draw face detections
if results.detections:
for detection in results.detections:
mp_drawing.draw_detection(frame, detection)
# Display the resulting frame
cv2.imshow('Face Detection', frame)
if cv2.waitKey(1) & 0xFF == ord('q'):
break
cap.release()
cv2.destroyAllWindows()
ติดตั้ง Mediapipe: ใช้คำสั่ง pip ติดตั้ง:
pip install mediapipe
Mediapipe มีเอกสารและตัวอย่างที่ดีสำหรับการเริ่มต้นใช้งาน สามารถศึกษาเพิ่มเติมได้ที่ Mediapipe Documentation.
ตัวอย่างการใช้งาน Mediapipe ด้วย JavaScript สามารถทำได้โดยใช้ WebAssembly (WASM) และ TensorFlow.js เพื่อให้ทำงานในเบราว์เซอร์ได้ดีขึ้น นี่คือตัวอย่างการติดตามใบหน้าด้วย Mediapipe ใน JavaScript:
ขั้นตอนการใช้งาน
เพิ่ม Mediapipe และ TensorFlow.js ลงในโปรเจ็กต์: ใช้ CDN เพื่อโหลด Mediapipe และ TensorFlow.js ใน HTML ของคุณ:
<!DOCTYPE html>
<html>
<head>
<title>Mediapipe Face Detection</title>
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/[email protected]"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script>
</head>
<body>
<video id="video" width="640" height="480" autoplay></video>
<script>
const video = document.getElementById('video');
// Set up video capture
async function setupCamera() {
const stream = await navigator.mediaDevices.getUserMedia({
video: true
});
video.srcObject = stream;
return new Promise((resolve) => {
video.onloadedmetadata = () => {
resolve();
};
});
}
// Load Mediapipe Face Detection
async function detectFace() {
const faceDetection = new FaceDetection.FaceDetection({
locateFile: (file) => `https://cdn.jsdelivr.net/npm/@mediapipe/[email protected]/${file}`
});
faceDetection.setOptions({
modelSelection: 1,
minDetectionConfidence: 0.2
});
faceDetection.onResults((results) => {
if (results.detections.length > 0) {
console.log(results.detections);
}
});
const camera = new Camera(video, {
onFrame: async () => {
await faceDetection.send({ image: video });
},
width: 640,
height: 480
});
camera.start();
}
async function main() {
await setupCamera();
await detectFace();
}
main();
</script>
</body>
</html>
อธิบายโค้ด:
- โหลด Mediapipe และ TensorFlow.js: ใช้ CDN ในการโหลด Mediapipe และ TensorFlow.js เพื่อง่ายต่อการเริ่มต้นใช้งาน
- setupCamera: ฟังก์ชันนี้จะใช้
navigator.mediaDevices.getUserMediaเพื่อเปิดกล้องและแสดงภาพบนแท็ก<video> - detectFace: ฟังก์ชันนี้จะตั้งค่า Face Detection และเริ่มต้นการตรวจจับใบหน้าโดยส่งภาพจากกล้องไปยัง Mediapipe
- main: ฟังก์ชันนี้จะเรียกใช้งานกล้องและเริ่มต้นการตรวจจับใบหน้า
