javascript - CCV 人脸检测 Javascript 库 Quenstion

Question

我正在使用这个库在用户相机的实时提要上进行面部检测，我想要完成的是在用户头上放置一个项目覆盖。演示附带的示例是跟随用户面部的傻眼镜。而不是我想跟踪用户头部的脸，我知道它是可能的，因为谷歌在谷歌环聊上这样做，你可以在视频聊天时放置各种物品。是否有任何教程，我可以继续使用 CCV 的库并扩展它以实现此功能吗？

Answer 1

似乎一个非常基本的解决方案就是将 glass.png 文件重新创建得更大一些并以矩形的形式......可能不完全是你所追求的，但这对我来说似乎是一个简单的解决方案.

Answer 2

我花了一点时间才弄清楚，但我发现了问题所在。

在计算位置的脚本 [Function "drawToCanvas"] 我不得不搞乱宽度和高度的计算。我的输出如下。

var video = App.video,
            ctx = App.context,
            backCtx = App.backContext,
            m = 5,
            w = 20,
            i ,
            comp;

        ctx.drawImage(video, 0, 0, App.canvas.width, App.canvas.height);

        backCtx.drawImage(video, 0, 0, App.backCanvas.width, App.backCanvas.height);

        comp = ccv.detect_objects(App.ccv = App.ccv || {
            canvas: App.backCanvas,
            cascade: cascade,
            interval: 4,
            min_neighbors: 1
        });

        if (comp.length) {
            App.comp = comp;
        }

        for (var i = 0; i < App.comp.length; i++){
            //ctx.drawImage(App.glasses, App.comp[i].x, App.comp[i].y+(App.comp[i].height*.7), App.comp[i].width, (App.comp[i].height/4));
            ctx.drawImage(App.glasses, (App.comp[i].x - w / .7) * m, (App.comp[i].y - w / .5) * m, (App.comp[i].width + w) * m, (App.comp[i].height + w) * m);

这样它就可以将您使用的任何图像放在用户头上。