VTK.js Visualization Project

Introduction

This project focuses on the visualization of cardiovascular data using VTK.js, a powerful JavaScript library for 3D visualization. The primary goal is to implement various types of vascular visualization techniques, including virtual endoscopy, cross-sectional views, and maximum intensity projection (MIP) slicing. These methods will provide an interactive and immersive way to explore and analyze cardiovascular datasets, which is crucial for both medical research and educational purposes.

Leveraging VTK.js and Vite for fast development, the project integrates 3D rendering capabilities directly into the browser. This allows for real-time interaction with complex medical data, offering an efficient and accessible approach for visualizing cardiovascular structures.

Project Setup

1. Clone the Repository

To get started, clone this repository to your local machine:

git clone https://github.ugent.be/wievdndr/Cardiovascular-Visualization.git

2. Browse to project directory

cd Cardiovascular-Visualization

3. Install packages

npm install

4. Start the vite dev server

Start the Vite developer server. This way, changes in code will automatically be reflected (hot-reload) in the visualization. Browse to the localhost port dynamically assigned by Vite (e.g., http://localhost:3000).

npm run dev

Project Usage

1. Import vessels_seg.vti file.

2. Create a mesh based on vessels_seg.vti. Adjust opacity and/or uncheck IJK Planes.

3. Import vessels_skel.vti file. Uncheck IJK Planes.

4. Create a skeleton graph based on vessels_skel.vti.

5a. Start an endoscopy:

• Press the start endoscopy button.

  • Use the Up Arrow key to move forward along the current branch.
  • Use the Down Arrow key to turn direction along the current branch. When you are facing the other direction, press the Up key again to move forward.
  • When at a branching point:
    • Press Up Arrow again to enter branch selection mode.
    • Use the Left Arrow key to cycle through available branches (smooth camera movement highlights the selected branch).
    • Use the Right Arrow key to cycle through available branches in the opposite direction.
    • Press Enter to confirm and move to the selected branch.
    • Press Escape to cancel branch selection and return to the previous position.

5b. Or start a cross-section visualization:

• Import vessels_data.vti file (optional: hide the planes).

• Press the start cross-section button.

  • Use the Up Arrow key to move forward along the current branch.
  • Use the Down Arrow key to turn direction along the current branch. When you are facing the other direction, press the Up key again to move forward.
  • When at a branching point:
    • Press Up Arrow again to enter branch selection mode.
    • Use the Left Arrow key to cycle through available branches (smooth camera movement highlights the selected branch).
    • Use the Right Arrow key to cycle through available branches in the opposite direction.
    • Press Enter to confirm and move to the selected branch.
    • Press Escape to cancel branch selection and return to the previous position.

5c. Or try the MIP slicer functionality:

• Import vessels_data.vti file (optional: hide the planes).

• Press the MIP slicer button.

• MIP slicer files will be downloaded in x, y, and z directions. You can import these individually.