東の方からきました@鹿駆動勉強会
Download as KEY, PDF0 likes969 views
4/29 に開催された鹿駆動勉強会で話した内容です。 http://atnd.org/events/24587
![WebRTCで取得した画像から ccv.js で顔認識 (抜粋)
// GetUserMedia で Web カメラから動画を取得
navigator.webkitGetUserMedia("video", success, fail);
function success(stream) {
var url = webkitURL.createObjectURL(stream);
srcStream.src = url;
setInterval(draw, 500);
}
function draw() {
workContext.drawImage(srcStream, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT);
destContext.drawImage(srcStream, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT);
// Canvas に描画されたピクセルデータから ccv.js で顔認識
var comp = ccv.detect_objects({"canvas":ccv.grayscale(workCanvas),
"cascade":cascade,
"interval":5,
"min_neighbors":1 });
// 認識された顔の位置に鹿の画像を合成
for (var i = 0, length = comp.length; i < length; i++) {
destContext.drawImage(personaImage, comp[i].x - 50, comp[i].y - 70, comp[i].width + 120, comp[i].height + 120);
}
// Socket.IO で共有
socket.emit('face', destCanvas.toDataURL("image/jpeg"));
}
たったこれだけ](https://image.slidesharecdn.com/node-sika-120428235749-phpapp01/85/-8-320.jpg)
東の方からきました@鹿駆動勉強会
- 1. 東の方からきました 2012/4/29 LT＠鹿駆動開発 @hakobera
- 2. 誰？ • 本多 一行 / Kazuyuki Honda • twitter: @hakobera • 仕事は Java • Playframework アツい
- 4. 鹿駆動に参加したきっかけ •能楽堂 •能(楽)堂 •のうどう •Node !?
- 6. JavaScript の限界突破 • WebRTC • Camera! Audio! • WebSocket • Push！Realtime! Reactive!
- 7. WebRTC で顔認識
- 8. WebRTCで取得した画像から ccv.js で顔認識 (抜粋) // GetUserMedia で Web カメラから動画を取得 navigator.webkitGetUserMedia("video", success, fail); function success(stream) { var url = webkitURL.createObjectURL(stream); srcStream.src = url; setInterval(draw, 500); } function draw() { workContext.drawImage(srcStream, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT); destContext.drawImage(srcStream, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT); // Canvas に描画されたピクセルデータから ccv.js で顔認識 var comp = ccv.detect_objects({"canvas":ccv.grayscale(workCanvas), "cascade":cascade, "interval":5, "min_neighbors":1 }); // 認識された顔の位置に鹿の画像を合成 for (var i = 0, length = comp.length; i < length; i++) { destContext.drawImage(personaImage, comp[i].x - 50, comp[i].y - 70, comp[i].width + 120, comp[i].height + 120); } // Socket.IO で共有 socket.emit('face', destCanvas.toDataURL("image/jpeg")); } たったこれだけ