JavaScript 顔認識テクノロジーと顔認識 JavaScript ライブラリ Tracking.js

JavaScript 顔認識テクノロジーと顔認識 JavaScript ライブラリ Tracking.js_javascript スキル

WBOY

リリース： 2016-05-16 15:39:25

オリジナル

2745 人が閲覧しました

人工知能の認識技術には、どのようなアルゴリズムなのか、どのような解析処理なのか全く想像がつかないので、ずっと興味がありました。音声認識であっても、顔認識であっても、人の見た目や話し方はさまざまで、さまざまな角度から写真を撮ることができます。これらの認識技術がどのように機能するのか理解できません。この認識技術を使った「マスク」というゲームもありますが、顔認識技術も研究されるべきだと思います。 Facebook はこのテクノロジーを使用しており、ジェスチャーコントロールにも使用できるため、Web サイトにこのテクノロジーを使用できる場所が存在します。

顔認識に使用できる JavaScript パッケージの 1 つは、Jay Salvat と Liu Liu によって開発された Face Detection です。これは、提供された画像を分析し、見つかったすべての顔画像の座標を返す標準の jQuery プラグインです。どのように使われるのか見てみましょう！

jQuery.faceDetection

顔検出 jQuery プラグインを使用するには、4 つの js ファイルをインポートする必要があります:

<script src="jquery-1.4.3.min.js"></script>
<!-- mas js -->
<script src="facedetection/ccv.js"></script>
<script src="facedetection/face.js"></script>
<script src="jquery.facedetection.js"></script>

ログイン後にコピー

この顔認識プラグインの最初の 2 つのファイルは、そのさまざまな機能プログラムを通じて、画像内の顔の座標情報を格納する配列オブジェクトを取得できます。以下に例を示します:

var coords = jQuery("#myImage").faceDetection();
/* 返回：
 {
 x: 525
 y: 435,
 width: 144,
 height: 144,
 positionX: 532.6353328125226,
 positionY: 443.240976080536,
 offsetX: 532.6353328125226,
 offsetY: 443.240976080536,
 confidence: 12.93120119,
 neighbour: undefined,
 }
*/

ログイン後にコピー

検出メソッドにイベントコールバック関数を追加することもできます:

var coords = jQuery("#myImage").faceDetection({
 complete: function(image, coords) {
 // Do something
 },
 error: function() {
 console.warn("无法分析图片");
 }
});

ログイン後にコピー

認識された顔情報に対して任意の加工を施すことができます。写真の顔の周りにフレームを描くことができます:

jQuery("img").each(function() {
 var img = this;
 // 获取脸部坐标
 var coordinates = jQuery(img).faceDetection();
 // 在脸上画出框线
 if(coordinates.length) {
 coordinates.forEach(function(coord) {
 jQuery("<div&gt", {
 css: {
 position: "absolute",
 left: coord.positionX + 5 + "px",
 top: coord.positionY + 5 + "px",
 width: coord.width + "px",
 height: coord.height + "px",
 border: "3px solid white"
 }
 }).appendTo(img.parentNode);
 });
 }
});

ログイン後にコピー

非常にシンプルですが、もちろん抽出などの複雑な処理も可能です。

さまざまな写真を使用して顔認識を試しましたが、予想通り、結果は完璧ではありませんでした。しかし、それにもかかわらず、それはまだかなり良いです。これは非常に単純なスクリプト手法であり、完璧な手法はありません。この顔認識プラグインには顔比較機能がありません。この機能を実現するには、他の方法を使用して顔の特徴情報を提供する必要があります。全体として、非常に優れているので、ぜひ試してみることをお勧めします。

顔認識 JavaScript ライブラリ Tracking.js

Web 開発者にとって、オープンソース JavaScript ライブラリ Tracking.js は、コンピュータビジョンと拡張現実テクノロジを容易にします。これを使用すると、Kinect や Wii に似た効果を持つモーションセンシングアプリケーションを表示できます。また、JavaScript ライブラリのサイズは小さいです。 (~ 7k)、非常に軽量でシンプルなインターフェースを備えています。

Tracking.js はモバイル Web アプリケーションやデスクトップアプリケーションで動作し、Node.js ベースのサーバーと組み合わせることもできます。これはコンピュータグラフィックスのアルゴリズムと技術をブラウザにもたらし、顔認識 (特定の色または人/顔/体が動いたとき)、リアルタイムのカラートラッキングなどの機能を備えています。 Web 開発では、以前は C または C テクノロジを使用して同様の効果を実現できました。 Traking.js は Web コンポーネントを提供するため、Web フロントエンド開発者は JavaScript を知らなくても HTML タグコンポーネントにアクセスして同様の機能を実装できるため、Web 開発が大幅に簡素化されます。

Tracking.js には、Web ブラウザが顔や目の変化を認識できるようにするカラー追跡アルゴリズムとオブジェクト追跡コンポーネントが含まれています。たとえば、Web フロントエンドはこの機能を使用してユーザーアバターを設定することもできます。これは一部の Web サイトにとって優れた機能であると同時に、追跡された顔データをバックグラウンドデータベースと照合して、より有用なフィードバックを提供することもできます。ユーザーのデータ。

現在、GitHub 上の Tracking.js ソースコードプロジェクトは 200 回以上フォークされており、8 月初旬に JS ライブラリがバージョン 1.0 にアップグレードされました。

上記のコンテンツは、JavaScript 顔認識テクノロジーと顔認識 JavaScript ライブラリ Tracking.js を共有したものです。気に入っていただければ幸いです。