Skip to content

Instantly share code, notes, and snippets.

@dassiorleando

dassiorleando/color_detection.html

Created April 9, 2019 11:28
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save dassiorleando/0feb0ce02f2c72ae1ccdd6bf6a855743 to your computer and use it in GitHub Desktop.
Save dassiorleando/0feb0ce02f2c72ae1ccdd6bf6a855743 to your computer and use it in GitHub Desktop.
Download ZIP
Detect color into a video
Raw
color_detection.html
<!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>
<script>
$(document).ready(function() {
var colors = new tracking.ColorTracker(['magenta', 'cyan', 'yellow']);
colors.on('track', function(event) {
if (event.data.length === 0) {
// No colors were detected in this frame.
console.log('No color detected here');
} else {
event.data.forEach(function(rect) {
console.log(rect.x, rect.y, rect.height, rect.width, rect.color);
});
}
});
tracking.track('#myVideo', colors);
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment