1
0
mirror of https://github.com/konvajs/konva.git synced 2025-04-24 19:03:56 +08:00
konva/experimental/invert.js
ippo615 75d0b8fe04 Added experimental filter section.
I added the experimental folder to show some work on filters that
can be applied to an entire layer. Multiple filters can be applied
to a layer (in any order, multiple times). To hook into the layer I
use:

    layer.on('draw', filterFunc);

Eventually, I would like to move that to `layer.filterFunc` and
automatically apply it after the draw. `filterFunc` looks like:

function filterFunc(){
  // Get pixel data and create a temporary pixel buffer for working
  var imageData = this.getContext().getImageData(0,0,this.getCanvas().width,this.getCanvas().height);
  var scratchData = this.getContext().createImageData(imageData);
  // Apply all filters here
  ColorStretch(imageData,scratchData,{});
  // Copy the pixel data back
  this.getContext().putImageData(scratchData,0,0);
}

`ColorStretch` is an example of a filter. It takes 3 arguments: the
original image data, image data to write the result to, and an options
object.
2013-09-04 21:08:39 -04:00

15 lines
462 B
JavaScript

Invert = (function () {
var Invert = function (src, dst, opt) {
var srcPixels = src.data,
dstPixels = dst.data,
nPixels = srcPixels.length,
i;
for (i = 0; i < nPixels; i += 4) {
dstPixels[i+0] = 255 - srcPixels[i+0]; // r
dstPixels[i+1] = 255 - srcPixels[i+1]; // g
dstPixels[i+2] = 255 - srcPixels[i+2]; // b
dstPixels[i+3] = srcPixels[i+3]; // copy alpha
}
};
return Invert;
})();