人工知能の認識技術には、どのようなアルゴリズムなのか、どのような解析処理なのか全く想像がつかないので、ずっと興味がありました。音声認識でも顔認識でも、人の見た目や話し方は千差万別、撮り方も角度も違う、これらの認識技術の仕組みが理解できません。 JavaScriptの裸体認識技術は以前にも導入されており、「Mask」というゲームでもこの認識技術が使われているので、顔認識技術も研究されるべきだと思います。 Facebook はこのテクノロジーを使用しており、ジェスチャー コントロールにも使用できるため、Web サイトにこのテクノロジーを使用できる場所が存在します。
私が見つけた顔認識に使用できる JavaScript パッケージの 1 つは、Jay Salvat と Liu Liu によって開発された Face Detection です。これは、提供された画像を分析し、見つかったすべての顔画像の座標を返す標準の jQuery プラグインです。どのように使われるのか見てみましょう!
顔検出 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("<p>", { 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 ビデオ チュートリアル
以上がJavaScript の顔認識テクノロジーについて話しましょうの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。