Web viewers for fMRI
Sharing MRI data with colleagues can be a time-consuming exercise. The files are often large and data-sets need to be viewable in a flexible fashion. Rich features assist the communication of results, including:
- 3D viewing
- flexible slicing
- overlay of specific volumes
While there are many software packages for running on the desktop, there’s nothing better than being able to point to a simple HTML link and open the scan data in a prepared format. Therefore, I went digging for an open-source package or library to display MRI renders and slices.
Selection Criteria
It’s always helpful to have a shortlist of criteria when searching for software. This search was primarily focused on MRI software for viewing neuroimaging results. The list of desired features included:
- open source and easily extensible
- fast 3D rendering
- NIFTI image format support
- possibility of pre-loading volumes
- good thresholding and viewing tools
- (optional) labelling and annotation features
Summary of Software
There are many web-based image viewers but I found a number which either had restrictive licenses or appeared to be no longer developed. It was important to me to find a product that I could extend and customise in the future. This list is by no means exhaustive and I have ranked the packages for my particular needs. Do let me know if you think I’ve missed any good packages or your experiences with the packages shown:
Rank | Name/Link | Language | Speed | Formats | Pre-load | Live demo | Notes |
---|---|---|---|---|---|---|---|
1 | Papaya | javascript | 4⁄5 | NIFTI, DICOM, GIFTI, VTK | Yes | Demo | Intuitive and clean interface, does not support labels |
2 | AMI | javascript (three.js) | 3⁄5 | NIFTI, DICOM, NRRD, MHD, MGZ, VTK, STL | Yes | Demo | A toolkit to build custom viewers, powerful features but needs more config |
3 | BrainBrowser | javascript (three.js) | 4⁄5 | MINC, NIfTI and MGH | Yes | Demo | Supports annotation, but no updates for a while |
Adding images and surfaces to Papaya
Payaya does not allow rendering of surfaces on the fly (it’s desktop equivalent, Mango does). Therefore, we need to pre-render our surfaces and images (volumes) before loading them in Papaya.
For example, if we need to display a reference brain and two overlays, we would generate and upload the following files:
Reference image and surface:
- Add Image:
glass_brain.nii
- a standard reference brain volume data - Add Surface:
glass_brain.surf.gii
- the equivalent surface file
Overlay image and surface
- Add Image:
overlay1.nii
- the volume data - Add Volume:
overlay1.surf.gii
- equivalent volume (generate using Mango)
NB: you may have the volume data in hdr/img format, if that is the case, convert it to nifti using MRIcron.
NB: you may not have a surface render of your overlay, you can use Mango to render a surface from an overlay and save it out as a
surf.gii
file
Now we can even preload these files and select a view using HTML similar to this:
<head>
...
<script type="text/javascript">
var params = [];
params["worldSpace"] = true;
params["images"] = ["data/myBaseImage.nii.gz", "data/myOverlayImage.nii.gz"];
params["surfaces"] = ["data/mySurface.surf.gii"];
params["myOverlayImage.nii.gz"] = {"min": 4, "max": 10};
</script>
</head>
...
<div class="papaya" data-params="params"></div>
- see a demo of a customised viewer here: https://papaya.greenant.net/demo_overlay/index.html
- for further customisation options, see the github docs
References
- pycortex WebGL MRI viewer - an example of a custom interactive viewer using three.js, from the Gallant Lab
- The BrainBrowser Site has a nice Brain Atlas
- MRIConvert - useful for converting hdr/img files to nifti
- MRIcron - a great MRI toolkit
- MRIcroGL - An OpenGL version of MRIcron