javascript - HTML5 Canvas image segmentation -


i'm trying remove white/gray pixels of background (a wall) image foreground (a hand in case) should left.

i tried manipulating canvas pixels foreground extraction not nice because of shadow or other inconsistencies in background. tried green colored background doesn't enhance performance.

for (i = 0; < imgdata.width * imgdata.height * 4; += 4) {     var r = imgdatanormal.data[i + 0];     var g = imgdatanormal.data[i + 1];     var b = imgdatanormal.data[i + 2];     var = imgdatanormal.data[i + 3];     // compare rgb levels green , set alphachannel 0;     selectedr = *a value 0 - 255*     selectedg = *a value 0 - 255*     selectedb = *a value 0 - 255*     if (r <= selectedr || g >= selectedg || b <= selectedb) {         = 0;     } } 

is there sophisticated method or library make background of image transparent?

sample image

there few mistakes in code :

  • the last line a = 0 nothing changing local variable. have modify directly in array
  • after that, see result, have push pixel array context
  • since need (in example) check white/gray background (rgb(255, 255, 255)), need check if value of pixel superior, not inferior. , using and operator instead of or allows here filter bigger part of shadow (which gray every colour component has same value) without removing hand itself, more coloured.

here example :

var imgdata = context.getimagedata(0, 0, canvas.width, canvas.height);  (i = 0; < imgdata.width * imgdata.height * 4; += 4) {     var r = imgdata.data[i + 0];     var g = imgdata.data[i + 1];     var b = imgdata.data[i + 2];     var = imgdata.data[i + 3];     // compare rgb levels green , set alphachannel 0;     selectedr = 105;     selectedg = 105;     selectedb = 105;     if (r >= selectedr && g >= selectedg && b >= selectedb) {         imgdata.data[i + 3] = 0;     } }  context.putimagedata(imgdata, 0, 0); 

that still isn't perfect because of shadow, works.

result


Comments

Popular posts from this blog

python - No exponential form of the z-axis in matplotlib-3D-plots -

php - Best Light server (Linux + Web server + Database) for Raspberry Pi -

c# - "Newtonsoft.Json.JsonSerializationException unable to find constructor to use for types" error when deserializing class -