@cvsfun/mask v0.0.8

Mask

Do mask compositing processes with image mask or aphla matte.

install

$ yarn add @cvsfun/mask
# or
$ npm install --save @cvsfun/mask

Usage

import Mask from '@cvsfun/mask'
...
let compositeData = Mask.compositeImageMask(image, maskImage);
ctx.putImageData(compositeData, 0, 0);
...

import Mask from '@cvsfun/mask'
...
// Alpha channel data from alpha matte:
// matte: [0, 0, 0, ... , 255, 240, 233, ... , 0] 
let compositeData = Mask.compositeAlphaMatte(image, matte);
ctx.putImageData(compositeData, 0, 0);
...

Use

API

compositeImageMask(srcImage, imageMask)

• srcImage [HTMLImageElement](https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement) Source image element
• imageMask [HTMLImageElement](https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement) Mask image element
• returns: [ImageData](https://developer.mozilla.org/en-US/docs/Web/API/ImageData)

compositeAlphaMatte(srcImage, alphaMatte)

• srcImage [HTMLImageElement](https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement) Source image element
• alphaMatte <number > An array that contains alpha channel value of all pixels.
• returns: <ImageData | undefined>

Concept

• alpha channel: Technically refers to the fourth (A) channel in an RGBA image file.
• alpha matte: Value range is 0,1(100% opaque)，the result of separating the foreground and background. Usually a grayscale image, contains every pixel's alpha value.
• mask: Only has two values: 0 and 1, means opacity or opaque respectively.