JavaScript-Gesichtserkennungstechnologie und JavaScript-Bibliothek zur Gesichtserkennung Tracking.js_javascript-Fähigkeiten

Ich habe mich schon immer sehr für die Erkennungstechnologie künstlicher Intelligenz interessiert, weil ich mir nicht vorstellen kann, um welche Art von Algorithmus es sich handelt und um welche Art von Analyseprozess es sich handelt. Ob es sich um Spracherkennung, Gesichtserkennung oder andere Arten der Erkennung handelt, das Aussehen und die Art und Weise, wie Menschen sprechen, sind so unterschiedlich. Ich kann nicht verstehen, wie diese Erkennungstechnologien funktionieren. Es gibt ein Spiel namens „Mask“, das diese Erkennungstechnologie ebenfalls verwendet. Ich denke, dass Gesichtserkennungstechnologie ebenfalls untersucht werden sollte. Facebook nutzt diese Technologie und kann auch in der Gestensteuerung eingesetzt werden, sodass sie auf Ihrer Website einen Platz findet.

Ein JavaScript-Paket, das ich für die Gesichtserkennung verwendet werden kann, ist Face Detection, das von Jay Salvat und Liu Liu entwickelt wurde. Es handelt sich um ein Standard-jQuery-Plugin, das das bereitgestellte Bild analysiert und die Koordinaten aller gefundenen Gesichtsbilder zurückgibt. Mal sehen, wie es verwendet wird!

jQuery.faceDetection

Um das jQuery-Plugin zur Gesichtserkennung zu verwenden, müssen Sie vier js-Dateien importieren:

<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>

Die ersten beiden Dateien dieses Gesichtserkennungs-Plug-Ins sind seine verschiedenen Funktionsprogramme. Über sie können Sie ein Array-Objekt abrufen. Diese Objekte speichern die Gesichtskoordinateninformationen im Bild. Hier ist ein Beispiel:

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,
 }
*/

Sie können der Erkennungsmethode auch Ereignisrückruffunktionen hinzufügen:

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

Sie können die erkannten Gesichtsinformationen beliebig verarbeiten. Sie können im Bild einen Rahmen um das Gesicht zeichnen:

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);
 });
 }
});

Das ist sehr einfach, natürlich können Sie komplexe Verarbeitungen durchführen, wie zum Beispiel die Extraktion.

Ich habe verschiedene Bilder verwendet, um die Gesichtserkennung auszuprobieren, und wie erwartet waren die Ergebnisse nicht perfekt. Aber egal, es ist immer noch ziemlich gut. Dies ist eine sehr einfache Skripttechnik, und keine Technik ist perfekt. Dieses Gesichtserkennungs-Plug-in verfügt nicht über eine Gesichtsvergleichsfunktion. Sie müssen andere Methoden verwenden und Informationen zu Gesichtsmerkmalen bereitstellen, um diese Funktion zu erreichen. Alles in allem ist es ziemlich gut und ich empfehle Ihnen dringend, es auszuprobieren.

JavaScript-Bibliothek zur Gesichtserkennung Tracking.js

Für Webentwickler erleichtert die Open-Source-JavaScript-Bibliothek Tracking.js die Computer-Vision- und Augmented-Reality-Technologie. Sie kann zur Anzeige von Bewegungserkennungsanwendungen mit ähnlichen Effekten wie Kinect oder Wii verwendet werden, und die JavaScript-Bibliothek ist klein (~ 7k), sehr leicht und mit einer einfachen Schnittstelle.

Tracking.js kann in mobilen Webanwendungen und Desktop-Anwendungen funktionieren und kann sogar mit Node.js-basierten Servern gekoppelt werden. Es bringt Computergrafikalgorithmen und -technologie in den Browser und verfügt über Funktionen: Gesichtserkennung (wenn eine bestimmte Farbe oder wenn sich eine Person/Gesicht/Körper bewegt) und Farbverfolgung in Echtzeit. Für die Webentwicklung war es früher möglich, durch C bzw. C-Technologie ähnliche Effekte zu erzielen. Jetzt bietet Traking.js eine Webkomponente, sodass Web-Frontend-Entwickler auf HTML-Tag-Komponenten zugreifen können, um ähnliche Funktionen zu implementieren, ohne JavaScript zu kennen, was die Webentwicklung erheblich vereinfacht.

Tracking.js enthält einen Farbverfolgungsalgorithmus und Objektverfolgungskomponenten, die es Webbrowsern ermöglichen, Veränderungen in Gesichtern und Augen zu erkennen. Beispielsweise kann das Web-Frontend diese Funktion auch zum Festlegen von Benutzer-Avataren verwenden, was für einige Websites ebenfalls eine coole Funktion ist. Gleichzeitig kann es die erfassten Gesichtsdaten mit der Hintergrunddatenbank abgleichen, um nützlicheres Feedback zu geben Benutzerdaten.

Derzeit wurde das Tracking.js-Quellcodeprojekt auf GitHub mehr als 200 Mal geforkt. Anfang August wurde die JS-Bibliothek auf Version 1.0 aktualisiert.

Der obige Inhalt ist die JavaScript-Gesichtserkennungstechnologie und die Gesichtserkennungs-JavaScript-Bibliothek Tracking.js, die ich mit Ihnen geteilt habe.