Integrating NiiVue into VS Code – A flexible image viewer for neuroimaging pipeline developers

Presented During:

Monday, June 24, 2024: 5:45 PM - 7:00 PM
COEX  
Room: Grand Ballroom 103  

Poster No:

2242 

Submission Type:

Abstract Submission 

Authors:

Korbinian Eckstein1, Fernanda Ribeiro1, Thuy Dao1, Cosima Prahm2,3, Chris Rorden4, Taylor Hanayik5, Chris Drake4, Steffen Bollmann1

Institutions:

1The University of Queensland, Brisbane, QLD, 2BG Klinik Tuebingen, Tuebingen, Germany, 3University of Tuebingen, Tuebingen, Germany, 4University of South Carolina, Columbia, SC, 5University of Oxford, Oxford, United Kingdom

First Author:

Korbinian Eckstein  
The University of Queensland
Brisbane, QLD

Co-Author(s):

Fernanda Ribeiro  
The University of Queensland
Brisbane, QLD
Thuy Dao  
The University of Queensland
Brisbane, QLD
Cosima Prahm  
BG Klinik Tuebingen|University of Tuebingen
Tuebingen, Germany|Tuebingen, Germany
Chris Rorden  
University of South Carolina
Columbia, SC
Taylor Hanayik  
University of Oxford
Oxford, United Kingdom
Chris Drake  
University of South Carolina
Columbia, SC
Steffen Bollmann  
The University of Queensland
Brisbane, QLD

Introduction:

For the development of new imaging and reconstruction methods, it is essential to have a convenient way to quickly view and compare images. While many professional viewers exist for medical images, they fail to streamline the workflow for developers. It is often inconvenient to transfer the files from the reconstruction computer to the device with the imaging software installed. Moreover, software is often limited to specific operating systems and supports only a small subset of image formats. Therefore, we developed a medical image viewer extension for Visual Studio Code (vscode) based on the NiiVue project [1] for simple and fast viewing of local and remote files. This viewer is primarily targeted towards developers of reconstruction pipelines, but also supports a wide range of imaging workflows in vscode.

Methods:

The niivue-vscode design prioritizes intuitive access to most commonly used features, aiming for minimal user clicks. While also incorporating advanced functionalities, the primary goal is to ensure a straightforward user experience, specifically tailored to developing workflows.

Built upon the webGL-based NiiVue medical image viewer library [1], the niivue-vscode extension integrates its capabilities into the vscode environment. This extension not only serves as an interface to vscode but enhances its functionality especially for viewing multiple volumes in a synchronized view. This integration combines vscode's robust remote capabilities with the seamless image viewing capability of NiiVue.

Results:

More than 30 medical image formats are supported. The left side of Figure 1 shows the basic multiplanar layout with a 3D rendered image, and the right side of Figure 1 shows a mesh with curvature and a superimposed colored overlay. In the context of meshes, the extension further features saving and loading of the current view-angle.

Comparison of multiple volumes is supported with synchronization of the selected voxel and of zoom settings between the volumes (Figure 2). After selecting the volumes in the vscode file explorer, they can be opened by right-clicking and selecting "NiiVue: Compare". Contrast adjustments can be applied to all loaded images simultaneously. In addition to the images, basic metadata is presented and detailed header information can be accessed quickly.

The vscode extension was developed to be compatible with remote environments and supports opening of images in a remote vscode session, e.g., through an ssh-connection to a cloud virtual machine or high-performance computing cluster, and it also supports vscode web and github.dev.

Niivue-vscode uses web-based technologies and can be additionally accessed via the browser at https://korbinian90.github.io/niivue-vscode/. It supports progressive web application features and can be installed from chromium-based browsers as a local app on all major operating systems and integrates with local file associations.

The code base is hosted open-source and feedback of the community is actively encouraged. The extension is in active development and a list of features planned to be integrated in future versions is posted as issues on the github repository.
Supporting Image: figure1.png
   ·Figure 1: vscode window with two opened instances. Left: default multiplanar view with a 3D rendering. Right: mesh with curvature and superimposed overlay
Supporting Image: figure2.png
   ·Figure 2: Synchronized view of multiple volumes in vscode. The pixel location, the selected slice as well as the zoom level are synchronized between all images
 

Conclusions:

Niivue-vscode is a convenient tool to quickly view medical images for comparing and debugging during the development process of reconstruction and analysis pipelines. It supports over 30 medical imaging formats for voxel-based and mesh data assisting in image analysis and visualization across different contexts.

Modeling and Analysis Methods:

Image Registration and Computational Anatomy
Methods Development 2

Neuroanatomy, Physiology, Metabolism and Neurotransmission:

Neuroanatomy Other

Neuroinformatics and Data Sharing:

Workflows
Informatics Other 1

Keywords:

Open-Source Software
Other - NIfTI, DICOM, viewer, medical images

1|2Indicates the priority used for review

Provide references using author date format

[1] NiiVue repository; https://github.com/niivue/niivue