Content
Hello AMI
Lesson 00: Load
Load DICOM Data and get a nice Series/Stack/Frame structure.
|
Lesson 01: Visualize 3D
Look at the data we loaded in 3D.
|
||
Lesson 02: Mesh
Add a mesh to the scene.
|
Lesson 03: Visualize 2D
Look at the data in 2D.
|
||
Lesson 04: Labelmap
Overlays on top of you data.
|
Lesson 05: TRK
TRK - coming soon.
|
||
Lesson 06: Volume Rendering
Volume Rendering.
|
Lesson 07: Lookup tables
Lookup Tables - coming soon.
|
||
Lesson 08: Custom progress bar
Custom progress bars.
|
(more) Advanced demos
Volume rendering, 2D viewer, arbitrary reslicing and more examples and advanced demos there!
Features
✅ READY 🔶 IN PROGRESS OR LIMITED SUPPORT ❌ ON ROADMAP
Capabilities | Volumes | Meshes | Widgets |
---|---|---|---|
✅ 2D Visulization | ✅ Dicom | ✅ VTK (THREEJS) | 🔶 Handle (2D/3D) |
✅ 3D Visualization | ✅ NRRD | ✅ STL (THREEJS) | 🔶 Probe (2D/3D) |
✅ Volume Rendering | ✅ Nifti | ✅ TRK | 🔶 Ruler (2D/3D) |
✅ Lookup Tables | ✅ MHD/(Z)RAW | ✅ FSM | 🔶 Orientation (2D/3D) |
✅ Label Maps | ✅ MGH/MGZ | ❌ CURV | 🔶 Angle (2D/3D) |
❌ JPEG |
Usage
Pre-requisites
- ES2015 promises support. (consider using polyfills if needed)
- Load THREEJS your index.html BEFORE AMI.
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r81/three.js"></script>
Yarn
$> yarn add ami.js
Note: you might need to include babel transforms in you build process.
// app.js
import * as AMI form 'ami.js';
window.console.log('Ready to rock!!');
ami.js
Check-out the lessons to get started quickly.
New: Use the new factory not to have to include three
in index.html.
import * as THREE from 'three';
import {stackHelperFactory} from 'ami.js';
const StackHelper = stackHelperFactory(THREE);
const stackHelper = new StackHelper();
Add AMI in your index.html after THREEJS.
<!-- index.html -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r81/three.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ami.js/0.0.12/ami.min.js"></script>
<script src="app.js"></script>
#app.js
const AMI = AMI;
window.console.log('Ready to rock!!');
Developer corner
Get the source code and related packages.
$> git clone https://github.com/FNNDSC/ami.git
$> cd ami
$> yarn install
To run examples (browserify/babelify/serve the example)
$> yarn example <examples name>
#run the geometries_slice example
$> yarn example geometries_slice
Build standalone library to lib/
$> yarn build:ami
Build minified standalone version run
$> yarn build:ami:prod
Tests
$> yarn test
Documentation
$> yarn doc
Build and deploy dist/ to gh-pages
$> yarn deploy
Find out more about the API.
Change log
Credits
AMI would not exist without them:
THREEJS
- Base components such as Vectors, Matrices and Objects3D.
- HTML template for example page.
- Author(s): mrdoob
DicomParser
- DICOM parsing relies on it.
- Author(s): chafey
CornerstoneWADOImageLoader
- Was used to figure out how to use the dicom parser properly.
- Author(s): chafey
NIFTI-Reader-JS
- Nifti parsing relies on it.
- Author(s): rii-mango
NRRD-JS
- NRRD parsing relies on it.
- Author(s): jaspervdg
JPEGLosslessDecoderJS
- JPEG Lossless Decoder for DICOM images
- Author(s): rii-mango
Image-JPEG2000
Pako
- GZ file decompression
- Author(s): nodeca
Citations
2017
- From brain imaging to weather imaging - McCaie - informaticslab, Met Office (blog post)
- Medical imaging in the browser with the A* Medical Imaging (AMI) toolkit. - Rannou et al. - ESMRMB 2017 (poster)
- Reusable Client-Side JavaScript Modules for Immersive Web-Based Real-Time Collaborative Neuroimage Visualization - Bernal-Rusiel et al. - Frontiers in Neuroinformatics 2017 (article)