Ask Your Question

Revision history [back]

Opencv.js - Background subtraction and replacement in Javascript

I'm applying the items in this tutorial, in an attempt to replace a background image of a video while maintaining the foreground objects. Ideally, I'd like to replace the black and white mask that is generated with the color version of the arm holding the box, in a different setting (image background). I'm stuck on generating the mask, and applying the new background image with the foreground of the video frame.

enter image description here

I'm familiar with OpenCV in python, but am struggling to find resources or documentation on what is and what isn't implemented in the opencv.js build. I realize that all of the functionality is not implemented in opencv.js. However, I am almost certain this is achievable with opencv.js, I'm just not sure what steps I need to take as it appears the python examples I'm trying to port are not correct.

That said, here's a python example that accomplishes what I'm attempting to do.

enter image description here

If anyone has any pointers on how I can turn the black and white mask into a bounding area to obtain the arm holding the box and swap it's color image background that would be helpful.