4 ms·

Javascript motion tracking

43 points by middleman90 15y ago

tomp 15y ago
If I understand this correctly, this is not motion tracking in Javascript, rather the JavaScript just renders the picture on the video using precalculated data about the position of the corners...
- whalesalad 15y ago
  After skimming js/app.js, this does seem to be the case.
- antimatter15 15y ago
  That seems to be the case given that http://www.soundstep.com/blog/experiments/jstracking/js/app.js http://www.soundstep.com/blog/experiments/jstracking/js/app.... starts with var tracking_data = [[243.625,172.75,249.014,171.041,252.918,169.895...
- pedalpete 15y ago
  would "motion drawing" be a better title? How would you condense your description into something the average person could understand? That may help the creator.
  - tomp 15y ago
    Maybe "Overlaying picture over video in pure JS + <canvas>"? Unfortunately, I believe that this article was mainly popular because of it's catchy, yet wrong title (which would certainly be revolutionary if it were correct). That doesn't mean, of course, that what the article describes is trivial/easy. I've studied math, but I'd still have to think for quite some time to figure out what kind of matrix transformation to perform... and, making it 100+ fps in Javascript is impressive in itself!
nl 15y ago
Back in 2009 I did some work on augmented reality in the browser[1]. Back then there was no WebRTC, so I had to shim Flash to Canvas to get webcam images, and I implemented image tracking using a simple color tracking algorithm. If this really is doing image tracking in JS (as tomp noted the explanation isn't clear) then I'm very impressed. The previous state of the art was some great face-detection code I'd seen, but it is much slower than this. [1] http://nicklothian.com/blog/2009/11/18/augmented-reality-virtual-keyboard-using-html-5-video/ http://nicklothian.com/blog/2009/11/18/augmented-reality-vir... [2] http://liuliu.me/eyes/javascript-face-detection-explained/ http://liuliu.me/eyes/javascript-face-detection-explained/, http://apprtc.appspot.com/html/face.html http://apprtc.appspot.com/html/face.html

43 points by middleman90 15y ago

tomp 15y ago

If I understand this correctly, this is not motion tracking in Javascript, rather the JavaScript just renders the picture on the video using precalculated data about the position of the corners...

whalesalad 15y ago
After skimming js/app.js, this does seem to be the case.
antimatter15 15y ago
That seems to be the case given that http://www.soundstep.com/blog/experiments/jstracking/js/app.js http://www.soundstep.com/blog/experiments/jstracking/js/app.... starts with var tracking_data = [[243.625,172.75,249.014,171.041,252.918,169.895...
pedalpete 15y ago
would "motion drawing" be a better title? How would you condense your description into something the average person could understand? That may help the creator.
- tomp 15y ago
  Maybe "Overlaying picture over video in pure JS + <canvas>"? Unfortunately, I believe that this article was mainly popular because of it's catchy, yet wrong title (which would certainly be revolutionary if it were correct). That doesn't mean, of course, that what the article describes is trivial/easy. I've studied math, but I'd still have to think for quite some time to figure out what kind of matrix transformation to perform... and, making it 100+ fps in Javascript is impressive in itself!

nl 15y ago

Back in 2009 I did some work on augmented reality in the browser[1]. Back then there was no WebRTC, so I had to shim Flash to Canvas to get webcam images, and I implemented image tracking using a simple color tracking algorithm. If this really is doing image tracking in JS (as tomp noted the explanation isn't clear) then I'm very impressed. The previous state of the art was some great face-detection code I'd seen, but it is much slower than this. [1] http://nicklothian.com/blog/2009/11/18/augmented-reality-virtual-keyboard-using-html-5-video/ http://nicklothian.com/blog/2009/11/18/augmented-reality-vir... [2] http://liuliu.me/eyes/javascript-face-detection-explained/ http://liuliu.me/eyes/javascript-face-detection-explained/, http://apprtc.appspot.com/html/face.html http://apprtc.appspot.com/html/face.html