I've been searching for an npm module that is converts a JPEG-encoded file into an abstracted format, easy for manipulation. e.g. This format would allow one to easily edit the RGBA value at a given position, and write it back to the buffer, similar to image manipulation libraries in Python / Java.
Searches have yielded such modules from RGB values -> JPEG (https://github.com/pkrumins/node-image), but not from JPEG -> RGB model. Does such a module even exist?
// First load Image
var jpegData = fs.readFileSync('grumpycat.jpg');
// Decode Image
var rawImageData = jpeg.decode(jpegData);
// rawImageData =>
// {
// data: [<red>, <green>, <blue>, <alpha>, <red>, <green>, <blue>, <alpha> ...]
// width: 400
// height: 300
// }
// Encode Image
jpegData = jpeg.encode(rawImageData, 50);
function getImageData(url, callback){
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
var img = new Image();
img.onload = function(){
context.drawImage(this, this.width, this.height);
callback(context.getImageData(0, 0, this.width, this.height))
}
img.crossOrigin = 'Anonymous';
img.src = url;
}
getImageData('<url-to-img>',function(imgData){
console.log(imgData);
});
Based on list for graphics modules, there is no much you can use to make your challenge straight forward. And Google is quiet as well.
But.
There is one way I would suggest: use node-canvas in order to load image and draw it into canvas. Then you can access pixels using getImageData, and do with them whatever you want.
Btw, JPEG does not have A channel, only RGB, while canvas does have 4 channels (RGBA).
You can use GraphicsMagick to convert to RGBA with http://aheckmann.github.io/gm/
The resulting 'format' is a plain RGBA stream for easy manipulation.
Use the same module to export the result to whatever format you prefer.
Thanks. In the end, I gave up.
What worked for me was to write a wrapper for an existing terminal utility, and calling it from the server script. Works well! (: