How to decode manually JPEG Lossless, Non-Hierarchical, First-Order Prediction - javascript

I'm trying to create a DICOM viewer on my own, using only JavaScript and HTML5. I'm working on this project for the last few days and now I successfully parse all textual information I need and I can also correctly read and display uncompressed Grayscale and RGB images. Now I'm trying to display the so called "JPEG Lossless, Nonhierarchical, First- Order Prediction" type of image (in the DICOM file, it is enumarated with the Transfer Syntax Unique Identification: 1.2.840.10008.1.2.4.70) but I'm stuck. I want to read the Pixel Data of the image manually and build the image out of it. There is no actual information on how the bits are stored in the DICOM documentation and I really tried to find a good description of this kind of JPEG on the internet but with no success. Can you give me some advice on what exactly I have to read to solve my problem. Thank you all :)

Check this document, probably it leads you into the right direction
JPEG Lossless Codec
There are also some more links which may help:
dclunie jpeg sources

FYI, the Orthanc server for medical imaging already provides JPEG Lossless decompression through a REST API, which allows JavaScript/HTML5 applications to very easily display DICOM images in Web browsers. You can for instance have a look at the DWV plugin by Yves Martel.

Related

Inserting ICC profile obtained from a jpg image into a png image in frontend Javascript

I am trying to insert ICC profile data parsed from a JPG/JPEG image back into a PNG image. I have parsed this data taking help from this and this source, But I am unable to find solutions for re-inserting this profile back into a PNG Image. I have looked at PNG specs and tried to insert the data byte wise (following these instructions) but the newly formed image is getting corrupted. Any help or guidance towards the right direction is highly appreciated.
I am trying to achieve the above task in frontend and I am using React-JS for the same.
try this npm package, with the following package you can convert imageData into .png

How to convert PDF into image or compress the PDF JS?

I am using next js for my web application, I am having a requirement where when a user uploads a pdf to my input, I will have to compress it (for example: 1MB). I searched here and there, but I am not able to get a prominent solution which can help me out! If I cannot compress a pdf, I would at least like to convert it into an Image, which I can use a library to convert? Can someone help me out on how to compress a PDF?
I would recommend:
Convert API
You have to pay, but it is a very easy and clean solution.
Alternatively, you can use:
Shrink PDF
...which is a wrapper for ghost script. more complex than the Convert API but easier than implementing ghost script yourself.
Or:
Ghost script
...You can implement it yourself if you wish.
Realistically, you are not going to be able to get a simple Node package where you can just do pdf.compress() and it is done well, unless it is a paid API.

converting a binary raw image data in javascript

I'm using a firebreath plugin and I am sending a raw binary image data from the plugin to JavaScript, but was not able to use this data as JavaScript did not recognize this. I later converted the raw image data to base64 format and used in JavaScript in which case I was able to draw the image but performance was hit as base64 conversion took nearly 100ms for each conversion.
Is there a way where in I can draw image directly from the raw image? I Basically have to improve performance.
rather than drawing it on a canvas, you could try putting a data URI in an image tag and sending it as a jpeg. Basically compress the image as much as you reasonably (for your application) can before you send it to javascript in order to minimize the amount you need to convert w/ base64. The only other way I could see it maybe working would be to use a websocket to talk to the plugin, which has its own problems.

node-canvas: output PNG file as interlaced/progressive

node-canvas is a Node.js version of the HTML5 canvas library that depends on Cairo. My app creates a bunch of PNG files depending on that data that is sent to the app.
node-canvas offers two functions toBuffer() and toDataURL() which outputs raw PNG or Base64 encoded PNG to a string which I can send to the browser. However there is no way to add support for interlacing in the library.
I'd like to extend the functionality of the library and add support for interlaced PNGs. I have the raw PNG data in a string, and also an array of pixels for the image (if need be). I do not have an understanding of how PNG encoding works. Can someone please point me to the algorithm I need to use to convert the data I have, either the non-interlaced raw PNG data or the pixel array and convert it to an interlaced/progressive PNG?
This is a necessary step for the graphing calculator app that I am building that graphs complex equations. It would be good to have a blurry image that appears quickly and sharpens over time than a non-interlaced PNG that loads from top to bottom for my app.
Thanks!
You can't convert a non-interlaced raw PNG data to a interlaced PNG stream. Interlaced vs non-interlaced PNG are two different ways of PNG encoding (they basically differ in the pixel stream ordering, but after that a filter-compression is applied, so you can't simply alter the final stream to switch between interlaced and non-interlaced modes). TO generate an interlaced PNG is work of the PNG encoder, the one which is used to write your PNG files (or stream) from the raw image pixels.
Nevertheless, I'd advise you against interlaced images; the compression efficiency suffers (specially with PNG) and the advantage for the user experience is at least debatable. See eg. Today, interlaced PNG is seldom used.

Convert JPEG or PNG to SVG format on VB.net/C# or Objective-C

I would like to convert a PNG or JPEG file to SVG. But I can't find anything on how to do it. The thing is I'm using devexpress reports to export it to image so the format can either be .jpg or .png. Now what I want is to convert it to SVG so that the image will still be in a better quality when passing it through Javascript and finally to Objective-C.
To explain a bit further.
I have a service which is coded using VB.net. This is server side; client side is Javascript and HTML: I'm using Phonegap to bridge Objective-C. What I'm doing really is creating a plugin which would pass a URL from Javascript and have Objective-C catch the url, then load it as an image and pass it to the ePOS SDK to print as an image.
What I noticed is that when I'm exporting the report using devexpress as a png, the image gets pixelated and a bit grainy because I'm scaling the image to make it bigger to fill the thermal paper (80mm). That's why instead of PNG I want it in SVG to preserve the quality of the image.
My question is where should I convert the image? On the server side or in Objective-C? And how will I do such a daunting task? I was thinking of doing it in Objective-C, but I think it is much better to convert it on the server side. What do you think?
Also is it possible to convert .png or .jpeg to a .svg file?
Thanks
You could do it on the server side with ImageMagick, but I think that since you'll be converting a bitmap image to vector graphics, you'll just get the same low-quality crap. Can you export your reports to PDF or another vector graphics format?

Categories