Image manipulation with SailsJS - node.js

Has anyone made a sails app with skipper-s3 and image manipulation library to upload different sizes of images ?
For example if a user upload a user profile image then there will be three different sizes of images will be uploaded to the S3 server. Any help would be much appreciated.
Cheers.

You can use ImageMagick-Native to do the resizing before uploadng to S3, like this:
var resBuff = imagemagick.convert({
srcData: originalBuffer,
width: X, //dimensions in pixel
height: Y,
resizeStyle: "aspectfill",
quality: 80,
format: 'JPEG'
});
The resBuff object can now be uploaded to s3 as the resized image.

Related

Get exact dimensions of resized image using Sharp

I have a Cloud Function that resizes an image uploaded to Cloud Storage using Sharp. Everything works, but I'm trying to find a way for Sharp to include metadata of the exact height and width of the new image. I could make a new function that uses other npm packages to download the image from the url and get what I want, but I'm curious to know if there is a way for Sharp to do that as well?
just include "withMetadata()"
sharp('input.jpg')
.withMetadata()
.toFile('output-with-metadata.jpg')
.then(info => { ... });
you can find the documentation here
https://sharp.pixelplumbing.com/api-output#withmetadata

Read data from image and crop certain part of image in node js

My Client has requirement that user will upload image using that image i have to read data and crop some part of image. I am able to get read data from image using tesseract.js node module. Cropping part is also done it only work form some image not working for all images. below code to get data form images.
const Tesseract = require("tesseract.js");
Tesseract.recognize("./pancard.jpg", "eng", {
logger: m => console.log(m)
}).then(({ data: { text } }) => {
console.log(text);
});
For cropping image i am using sharp node module. below code basically resize image after resizing image its crop particular data.
const sharp = require("sharp");
sharp("./pancard.jpg")
.resize(500, 300, {
fit: sharp.fit.fill
})
.toFile("./pancard_new.jpg", (err, info) => {
sharp("./pancard_new.jpg")
.extract({ left: 35, top: 220, width: 180, height: 28 })
.toFile("./pancard_new2.jpg", function(err) {});
});
Above code working fine for below image i am able to get signature of that particular images.
but same code not working for below image.
Basically i want to crop signature from that images. If someone have idea how to start from where to start to do above task please help me out.
Note*: Images are from google.
It all comes down to the image, with sharp, you can provide a viewbox to crop the image, but if the image provided is rotated, your code won't work for the first image as well. I think you need some kind of ml driven library for your use case like opencv, or set the viewbox big enough to capture the signature.
If the signature panel on the Indian government ID is always in the same place, would it not be easier to just always crop the same viewbox? Rather than trying to detect the viewbox. That would be my MVP, if it needs to be dynamic later then it needs to be some computer vision library that is able to differentiate the signature from the rest of the ID.

Getting image from dicom .DCM file in node.js

I would like to generate a thumbnail image from a .dcm file (Dicom) in node.js.
So far I've found a node modules called dicom-parser that extracts the metadata from a dcm file.
My test case :
var dicom = require('dicom-parser');
var fs = require('fs');
var dicomFileAsBuffer = fs.readFileSync('./FullPano.dcm');
var dataSet = dicom.parseDicom(dicomFileAsBuffer);
var pixelData = new Uint8Array(dataSet.byteArray.buffer,
dataSet.elements.x00880200.items[0].dataSet.elements.x7fe00010.dataOffset,
dataSet.elements.x00880200.items[0].dataSet.elements.x7fe00010.length);
fs.writeFileSync('test5.jpg', pixelData); // <----- not working :'(
To help you help me debug, here is the dataSet.elements.x00880200 object :
But the pixelData stored in the tag x00880200 -> x7fe00010 is not in a standard format, either jpeg, jpg, png... The idea here is to get the thumbnail of a dcm image directly from a file, on the fly, server-side in nodejs.
From the dicom doc (see below), the tag 0088,0200 holds the data for the icon, aka thumbnail.
Icon Image Sequence
(0088,0200)
3
This icon image is representative of the Image.
Only a single Item is permitted in this Sequence.
I've come around the cornerstone libs : cornerstone-js and wado-image-loader. But neither are working in a node.js environment (made an issue about that). These libs can generate the "main" image of a dcm, but only once the dcm file is loaded on the cliend-side, in js. My requirement is to do that in nodejs, for the icon/thumbnail.
If you are trying to save the image icon as a JPG, that may be your issue:
Only monochrome and palette color images shall be used. Samples per Pixel (0028,0002) shall have a Value of 1, Photometric Interpretation (0028,0004) shall have a Value of either MONOCHROME 1, MONOCHROME 2 or PALETTE COLOR, Planar Configuration (0028,0006) shall not be present.source
I'm not familiar with node.js, but the data in the Icon Image Sequence may not be appropriate for that call.
Note also that you are getting an optional, small, thumbnail of the image, not the actual image data, which can be found in the Pixel Data attribute (7FE0,0010).
A bit late but, if you are still looking for an answer, you can use dcmjs-imaging (full disclosure, I am the author). The library implements a DICOM image and overlay rendering pipeline, for Node.js and browser.
The library supports uncompressed data but also, optionally, decodes all major transfer syntaxes using a native WebAssembly module.
Given that you have already fetched the the DICOM bytes in an ArrayBuffer, you can use the following Node.js example to render the image in an RGBA pixel ArrayBuffer.
// Import objects
const dcmjsImaging = require('dcmjs-imaging');
const { DicomImage, NativePixelDecoder } = dcmjsImaging;
// Optionally register native decoders WebAssembly.
// If native decoders are not registered, only
// uncompressed syntaxes would be able to be rendered.
await NativePixelDecoder.initializeAsync();
// Create an ArrayBuffer with the contents of the DICOM P10 byte stream.
const image = new DicomImage(arrayBuffer);
// Render image.
const renderingResult = image.render();
// Rendered pixels in an RGBA ArrayBuffer.
const renderedPixels = renderingResult.pixels;
// Rendered width.
const width = renderingResult.width;
// Rendered height.
const height = renderingResult.height;

How to render/generate image according to text/string in nodejs?

How can i generate an image of a string that has:
a size in px
embossed effect of the letters in the image
a font
a color
and other less important stuff that i think i can figure out once i achieve whats above like:
rotation of text
drop shadow
basically the user will send a request on how he wants his image to be.
but when i receive the request how should i make use of nodejs to render a png or a base64 url to send it back to the user. is there any libraries or way to achieve this.
i did some previous research and it doesn't seem like there is a frameworks that helps render text with a font and text style like emboss
You can try node canvas implementation: https://github.com/Automattic/node-canvas
Basically you can "draw" anything you want like if you'd be using browser js canvas, but some things may be different
Update - This will cover updating attributes of an image, not pulling text from image and updating that - you may need an image analysis library for that
Use the sharp library to manipulate the image as desired. https://github.com/lovell/sharp
http://sharp.dimens.io/en/stable/
A simple example that resizes (docs will show how to make the changes you want outside of this):
const request = require('request').defaults({ encoding: null });
request.get(imgUrl, params, function (err, res, body) {
sharp(body)
.resize(params.width, params.height)
.toFormat('jpeg')
.toBuffer()
.then((outputBuffer) => {
// outputBuffer contains JPEG image data no wider than params.width and no higher
// than params.height while maintaining quality of image.
let output = "data:" + res.headers["content-type"] + ";base64," + new Buffer(outputBuffer).toString('base64');
return output;
});
The output here will be the base64 image

Compressing image in Node.js

I am using Express to serve resized images. Which Node.js package should be used to resize the image? I've seen a lot of packages that change the image and save it as a file, but I need to change the image and write data to response. Example:
package.compress('/path/to/image.png',
{width: 100px, height: 100px},
function(result) {
res.end(result);
});
I chosen thumb-express (https://www.npmjs.com/package/thumb-express). This is what I need.

Resources