Alejandro GómezUbiMaker
Published

Face Counter with Raspberry Pi

Count how many people are looking at a camera.

Work in progress11,190
Face Counter with Raspberry Pi

Things used in this project

Hardware components

Web Camera
×1
Raspberry Pi 2 Model B
Raspberry Pi 2 Model B
×1

Software apps and online services

Ubidots
Ubidots
OpenCV
OpenCV

Story

Read more

Code

ubidotsCamera.js

JavaScript
The following code will stream the video from the camera to a localhost webpage:
var cv = require('opencv');
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);

var xml = './haarcascade_frontalface_alt2.xml';
var BLUE = [255, 0, 0]; //default red
var COLOR = [0, 255, 0]; //default red

var ubidots = require('ubidots');

// Replace with your Ubidots Token here
var client = ubidots.createClient('8324c8efe664adeed3f21c20f860ef37fb839ad0');

app.get('/', function(req, res){
  res.sendFile(__dirname+'/index.html');
});

app.get('/js/index.js', function(req, res){
  res.sendFile(__dirname + '/js/index.js');
});

app.get('/js/interact-1.2.2.min.js', function(req, res){
  res.sendFile(__dirname + '/js/interact-1.2.2.min.js');
});

app.get('/css/style.css', function(req, res){
  res.sendFile(__dirname + '/css/style.css');
});

io.on('connection', function(socket){
	
});

http.listen(2000, function(){
  console.log('listening on *:2000');
});

var loop = function () {
  var camera = new cv.VideoCapture(0);
  camera.setWidth(360);
  camera.setHeight(240);
  camera.read(function (err, image) {
	image.detectObject(xml, {}, function(err, faces) {
		for(var k = 0; k < faces.length; k++) {
			face = faces[k];
			image.ellipse(face.x + face.width/2, face.y + face.height/2, face.width/2, face.height/2, COLOR, 2);
		}
		io.emit('image', image.toBuffer().toString('base64'));
		io.emit('numface', faces.length);

		client.auth(function () {
			// Replace with your Ubidots VARIABLE ID here
			var v = this.getVariable('54e24ca876254262e98a3369');
			v.saveValue(faces.length);
		});
		camera.close();
	});
  });
};

setInterval(loop, 10000);

haarcascade_frontalface_alt2.xml.zip

XML
This code requires an external XML file to detect the faces. Download it from the following link and place it on the same folder as the "ubidotsCamera.js" file:
No preview (download only).

index.html

HTML
Finally, let's put an HTML in the same folder so we can access the camera from a browser:
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Ubidots</title>
  <script src="/socket.io/socket.io.js"></script>
</head>
<body>
  <img id="camera" />
  <div id="nav2">
        Faces: 
	<a id="text">Sensor</a>
        </br>
  </div>

  <script>
    var socket = io();
    var image = document.querySelector('#camera');

    socket.on('image', function (data) {
      image.src = 'data:image/png;base64,' + data;
    });

    socket.on('numface', function(data){
      document.getElementById("text").innerHTML = data;
    });

  </script>
</body>
</html>

Credits

Alejandro Gómez

Alejandro Gómez

3 projects • 18 followers
UbiMaker

UbiMaker

53 projects • 229 followers
Maker @ ubidots.com

Comments

Related channels and tags
  • Internet of Things
  • OpenCV
  • Raspberry Pi
  • Ubidots