AMI Viewer v0.1

Viewer developed using AMI JS library for medical image visualization on the Web (based on THREE.js) (https://github.com/FNNDSC/ami ). Can be downloaded and installer as an npm package using npm install ami-visualizer

AMIViewer Object

The AMIViewer object is the one exported by our library to be used externally. Its constructor is:

AMIViewer(container,'Tractography',filenames);

• Container: The HTML DOM Element to place the viewer
• Type: Type of the viewer.
  • Slices: Shows an MPR view and includes the Editor to paint segmentations. Loads a labelmap (.nii) and NIFTI/DICOM data.
  • Tractography: Shows an MPR View + a 3D view with fibers.
• Filenames: Structure that contains the URL to the data. It allows the data, labelmap and fibers field, e.g:

var filenames = {
  data: 'https://cdn.rawgit.com/YorkeUtopy/ami-viewerData/05384dc0/T1stripvolume.nii.gz',
  labelmap: 'https://cdn.rawgit.com/YorkeUtopy/ami-viewerData/05384dc0/labels.nii.gz'
};

Controls

• Move the volume / crosshair with the primary mouse button
• Zoom in/out with the secondary mouse button and dragging
• Scroll through slices with the mouse wheel.
• R resets the view.
• Press and hold E to activate the editor.

Editor

• Primary mouse button draws the current label.
• secondary mouse button erases segmentations.
• S saves the current segmentation state.
• C reverts to the last segmentation saved state.
• You can add and select a label with the GUI, and also reset to its initial state

Tractography Type

• A: Toggle Axial plane
• S: Toggle Sagittal plane
• C: Toggle Coronal plane
• F: Toggle Fibers.

Development

The application uses Browserify/Babelify and UglifyJS to create the builds that are stored on the build directory:

To serve the files use:

npm run serve

To build the library use:

npm run build

A example on how you would use the library to create a viewer would be:

var container = document.getElementById('container');

var filenames = {
  data: 'https://cdn.rawgit.com/YorkeUtopy/ami-viewerData/05384dc0/T1stripvolume.nii.gz',
  fibers: 'https://cdn.rawgit.com/aalises/ami-viewerData/d754e35e/streamline_downsampledDavid.trk',
  labelmap: 'https://cdn.rawgit.com/YorkeUtopy/ami-viewerData/05384dc0/labels.nii.gz'
};

let theViewer = new AMIViewer(container,'Tractography',filenames);