Buffer to image node js - node.js

I'm working on a server/client communication in node js.
Every second, the server send an image (taking by a camera) to the client.
The message structure contains among other things:
BufferX : the width of the image
BufferY : the height of the image
BufferImage : Bytes array containing pixel
The problem is: I would like to convert this buffer to an image and save it.
At first I try this:
let array = new Uint8Array(BufferImage );
fs.writeFileSync("data.png",array)
But the image isn't readable because the buffer only contains raw pixels data.
I've copy past the buffer to a python script, convert to a numpy array and reshape it. The image is correct so I'm sure that the ImageBuffer contains the correct value.
So is it possible to convert a raw pixel buffer to an image ?

Have you tried:
let array = new Uint8Array(BufferImage);
fs.writeFileSync("data.png", Buffer.from(array).toString('base64'))

Related

Write File in a specific size NODE JS

I receive an image in base64 string and I wanted to save the image in 3 different sizes. My code for saving the image in my app is as following and it works, how can I set a sepcific size for the image ?
fs.writeFile(pathImage, new Buffer(base64String, "base64"), function (err) {}
You can't just save an image in different sizes by writing part of the file to disk. In order to resize your image you need to first know what image format you are working with and then use an appropriate library to resize the image, usually by reducing image quality or cropping the image.
For example if you are working with a JPEG, PNG, WebP, or TIFF images, you could use https://github.com/lovell/sharp
From its example page
const sharp = require('sharp');
sharp(inputBuffer)
.resize(320, 240)
.toFile('output.webp', (err, info) => ... );

Nodejs fs.readfile vs new buffer binary

I have a situation where I receive a base64 encoded image, decode it, then want to use it in some analysis activity.
I can use Buffer to go from base64 to binary but i seem to be unable to use that output as expected (as an image).
The solution now is to convert to binary, write it to a file, then read that file again. The FS output can be used as an image but this approach seems a bit inefficient and additional steps as i would expect the buffer output to also be a usable image as it has the same data?
my question, is how does the fs.readfile output differ from the buffer output? And is there a way i can use the buffer output as i would the fs output?
Buffer from a base64 string:
var bin = new Buffer(base64String, 'base64').toString('binary');
Read a file
var bin = fs.readFileSync('image.jpg');
Many thanks

How to render / display multiframe dicom images in vtk?

I am using gdcm ImageReader to read multiframe dicom file. It reads multiframe correctly but I am unable to display the multiframe dicom file.
I am using vtkImageViewer to display single frame image,
vtkImageViewer viewer = new vtkImageViewer();
vtkDICOMImageReader reader = new vtkDICOMImageReader();
reader.SetInputfile(..\\inputFile);
viewer.SetInput(reader.GetOutput());
It displays single frame images correctly but does not display multiframe images.
Anybody knows how to display multiframe dicom files???
I would advise you to use vtkImageViewer2 instead of vtkImageViewer in this context. The former has a method, SetSlice, where, according to the documentation:
'Each call to SetSlice() changes the image data (slice) displayed AND changes the depth of the displayed slice in the 3D scene'
Example**:
vtkSmartPointer<vtkImageViewer2> imageViewer = vtkSmartPointer<vtkImageViewer2>::New();
imageViewer->SetSlice(5); //Specify the index/slice in image data
** Assumes you have set the input connection/data, example in c++ language.

How to convert selected pdf page with gm

I am converting different images and pdf files with "gm" module for nodejs. Image types go successfully but when I want to convert PDF to image have problems. I need to covert only one selected page from pdf file to jpg/png. If I pass whole pdf file to "gm" it saves to image only first page, but I cannot find the way to save another page.
gm(file).toBuffer(format.toUpperCase(),
function (err, buffer) {
// so in buffer now we have converted image
}
Thank you.
You can use gm.selectFrame like this
gm(file).selectFrame(0).toBuffer() // To get first page
gm(file).selectFrame(1).toBuffer() // To get second page
// for only first pdf page use:
gm(file, 'pdf.pdf[0]').toBuffer(...)
// for only second pdf page use:
gm(file, 'pdf.pdf[1]').toBuffer(...)
There is spindrift for manipulating pdf (includes image conversion).
You can define your pdf using (You don't have you use all of the commands):
var pdf = spindrift('in.pdf')
.pages(7, 24)
.page(1)
.even()
.odd()
.rotate(90)
.compress()
.uncompress()
.crop(100, 100, 300, 200) // left, bottom, right, top
Later on convert to image:
// Use the 'index' property of an image element to extract an image:
pdf.extractImageStream(0)
If you have to use gm, you can do what #Ben Fortune suggested in his comment and split the pdf first.

How to display a binary image in pictureBox VC++

i'm working on a VC++ and OpenCV application, i'm loading images into picturBox and make some OpenCV operations on them, i assign the loaded image into IplImage to make processing on it but then assign the processed image again into the picture box, i write this code to load the image selected from openFileDialog into IplImage ,binarize the image then reassign the binarized image back to the pictureBox
code:
const char* fileName = (const char*)(void*)
Marshal::StringToHGlobalAnsi(openFileDialog1->FileName);
IplImage *img=cvLoadImage(fileName,CV_LOAD_IMAGE_COLOR);
int width=img->width;
int height=img->height;
IplImage *grayScaledImage=cvCreateImage(cvSize(width,height),IPL_DEPTH_8U,1);
cvCvtColor(img,grayScaledImage,CV_RGB2GRAY);
cvThreshold(grayScaledImage,grayScaledImage,128,256,CV_THRESH_BINARY);
this->pictureBox1->Image=(gcnew
System::Drawing::Bitmap(grayScaledImage->width,grayScaledImage->height,grayScaledImage->widthStep,
System::Drawing::Imaging::PixelFormat::Format24bppRgb,(System::IntPtr)grayScaledImage->imageData));
but i doesn't find a format which displays a binary image, any help about that.
Original Image:
Converted image:
You seem to be creating an RGB image (System::Drawing::Imaging::PixelFormat::Format24bppRgb) but copying into it a grayscale, presumably the System::Drawing::Imaging function doesn't do conversion - or isn't doing it properly.
Edit: Some more explanation.
Your greyscale image is stored in memory as one byte for each pixel Y0, Y1, Y2,Y3...... Y639 (we use Y for brightness, and assuming a 640 pixel wide image).
You have told the .net image class that this is Format24bppRgb which would be stored as one red,one green and blue byte per pixel (3bytes = 24bpp). So the class takes your image data and assumes that Y0,Y1,Y2 are the red,green,blue values for he first pixel, Y3,Y4,Y5 for the next and so on.
This is using up 3x as many bytes as your image has, so after 1/3 of the row it starts reading the next row and so on - which gives you the three repeated pictures.
ps. the fact that you have turned it into a binary image just means that the Y values are either 0 or 255 - it doesn't change the data size or shape.

Resources