npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

cornerstone-file-image-loader

v0.3.0

Published

A Cornerstone Image Loader for images (PNG, JPG) using the HTML5 File API or from ArrayBuffer

Downloads

556

Readme

cornerstone File Image Loader

A cornerstone Image Loader for images (JPG, PNG) using the HTML5 File API or from ArrayBuffer.

Using the File API presents in HTML5 or ArrayBuffer data is possible open local image such as JPEG and PNG in Cornerstone library.

Live Examples

View the Universal Dicom Viewer built on cornerstone.

Install

Via NPM:

npm install cornerstone-file-image-loader

Usage

Simply include the cornerstoneFileImageLoader.js in your HTML file after you load cornerstone.js and then set the cornerstone instance as an external module for cornerstoneFileImageLoader:

cornerstoneFileImageLoader.external.cornerstone = cornerstone;

This will let cornerstoneFileImageLoader register itself with cornerstone to load imageId's that have the imagefile schemes.

To display an image, first add a HTML5 file object to cornerstoneFileImageLoader then pass the image as the imageId parameter to a cornerstone loadImage():

const imageId = cornerstoneFileImageLoader.fileManager.add(file);
cornerstone.loadImage(imageId).then(function(image) {
	cornerstone.displayImage(element, image);
	...
}

Or if previously the data has loaded in a ArrayBuffer:

const imageId = cornerstoneFileImageLoader.fileManager.addBuffer(data);
cornerstone.loadImage(imageId).then(function(image) {
	cornerstone.displayImage(element, image);
	...
}

Build System

This project uses webpack to build the software.

Pre-requisites:

NodeJs - click to visit web site for installation instructions.

Common Tasks

Update dependencies (after each pull):

npm install

Running the build:

npm start

Automatically running the build and unit tests after each source change:

npm run watch

Why is this a separate library from cornerstone?

Cornerstone was designed to support loading of any kind of image regardless of its container, compression algorithm, encoding or transport. This is one of many possible image loaders that can provide the image pixel data to cornerstone to display

Copyright

Copyright 2019 Luigi Orso [email protected]