Created
April 9, 2019 11:31
-
-
Save dassiorleando/d3fa7e40811ef0953f0203753fe85394 to your computer and use it in GitHub Desktop.
Color detection with custom colors
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<title>tracking.js - first tracking</title> | |
<script src="tracking-min.js"></script> | |
<script | |
src="https://code.jquery.com/jquery-3.3.1.min.js" | |
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" | |
crossorigin="anonymous"></script> | |
</head> | |
<body> | |
<video id="myVideo" width="400" height="300" preload autoplay loop muted> | |
<source src='zuck.mp4' type="video/mp4" /> | |
</video> | |
<button id='on' >Tracker on</button> | |
<button id='off'>Tracker off</button> | |
<script> | |
var _t = null; | |
$(document).ready(function() { | |
//var ct = tracking.ColorTracker | |
tracking.ColorTracker.registerColor('green', function(r, g, b) { | |
if (r == 0 && g == 250 && b == 0) { | |
return true; | |
} | |
return false; | |
}); | |
tracking.ColorTracker.registerColor('black', function(r, g, b) { | |
if (r < 50 && g < 50 && b < 50) { | |
return true; | |
} | |
return false; | |
}); | |
var colors = new tracking.ColorTracker(['magenta', 'cyan', 'yellow','green']); | |
colors.on('track', function(event) { | |
if (event.data.length === 0) { | |
// No colors were detected in this frame. | |
} else { | |
event.data.forEach(function(rect) { | |
console.log(rect.x, rect.y, rect.height, rect.width, rect.color); | |
}); | |
} | |
}); | |
tracking.track('#myVideo', colors); | |
$('#on').click(function(e){ | |
_t.run(); | |
}); | |
}); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment