Implement Shared Sampling for Real-Time Alpha Matting using webgl shader language(glsl). Paper
Note: all JS are written in ES6 standard
- A modern browser
- turn on webgl. for new version chrome, it is automatically enabled.
- A webgl wrapper dependency
Igloo
. Do
npm install igloo-ext --save
or equaivalent to install this dependency.
4. Copy code into your project along with all the shaders and shared.js
let canvas = document.getElementById(YourCanvasID);
let runner = new SharedGL(canvas);
runner.setImage(ImageURL);
runner.setTrimap(TrimapURL);
// getScale is in the utils.js file
// image is the input image for matting
// scale is used to draw a centered result on canvas
let scale = utils.getScale(canvas.width, canvas.height, image.naturalWidth, image.naturalHeight);
// will draw the result to canvas
runner.run(scale);
go http://kingfolk.github.io, find project "Shared Matting WebGL" and click demo.