react-webcamera/src/filter-demos/filters.js

React webcamera component with direct access to the camera data

export function grayScale(data){
  for(let i = 0; i < data.length; i+=4){
    let r = data[i];
    let g = data[i+1];
    let b = data[i+2];
    var brightness = (3*r+4*g+b)>>>3;
    data[i] = brightness;
    data[i+1] = brightness;
    data[i+2] = brightness;
  }
  return data;
}

export function filterBlue(data){
  for(let i = 0; i < data.length; i+=4){
    let b = data[i+2];
    b = 0;
    data[i+2] = b;
  }
  return data;
}

export function filterRed(data){
  for(let i = 0; i < data.length; i+=4){
    let r = data[i];
    r = 0;
    data[i] = r;
  }
  return data;
}