11
JUIL

Tracking.js - Trackez vos mouvements sur webcam en Javascript

Publié le 11/07/13 à 13h36 par DJo

Tracking.js est une ressource Javascript permettant d'intéragir avec l'utilisateur directement dans le navigateur à l'aide de sa webcam.

Tracking.js est une ressource Javascript permettant d'intéragir avec l'utilisateur directement dans le navigateur.

Voici un bel exemple de la puissance du HTML5 et Javascript sur les navigateurs modernes.

Tracking.js est un script qui va capter directement des points de couleurs depuis votre webcam et donner la possibilité d'y apporter des interactions dans vos applications.

La ressource est composée de 3 fichiers Javascript:

  • tracking.js: Le core de l'application
  • color.js: Le module permettant le tracking des couleurs sur la webcam
  • human.js: Un module permettant de tracker les humains

Le module humain permet un tracking des yeux, de la bouche, de la face et du haut du corps. Mais le plus efficace reste le tracking de points de couleur.

Voici un exemple de tracking en live:

Voici un exemple de type Hello World pour mettre en place un tracking de couleur jaune qui imprime en console les coordonnées du point tracké:

<!doctype html>
<html>
<head>
    <title>tracking.js - hello world</title>
    <meta charset="utf-8">
    <script src="../dist/tracking.min.js"></script>
    <script src="../dist/tracker/color/color.min.js"></script>
    <style>
    * {
        margin: 0;
        padding: 0;
    }
    canvas {
        -moz-transform: scale(-1, 1);
        -o-transform: scale(-1, 1);
        -webkit-transform: scale(-1, 1);
        filter: FlipH;
        transform: scale(-1, 1);
    }
    </style>
</head>
<body>
    <script>
    var videoCamera = new tracking.VideoCamera().render();
    videoCamera.track({
        type: 'color',
        color: 'yellow',
        onFound: function(track) {
            console.log(track.x + track.y + track.z);
        }
    });
    </script>
</body>
</html>

De quoi créer des applications de type Kinect directement dans votre navigateur !

 

Site Officiel

Baraguiné par fabord le 25/09/13 à 14h20
fabord sur La Ferme du Web
Super je vais pouvoir essayer de développer une interface qu'on pourra bouger à la main

Ajouter un Commentaire

Pour poster un commentaire, vous devez être identifié. Vous pouvez choisir parmi ces trois méthodes d'identification:

Compte la Ferme du Web

Identifiez-vous
Inscrivez-vous

Compte Facebook

Connexion avec Facebook

Compte Twitter

Connexion avec votre compte twitter
Rechercher sur la Ferme du web