The X Toolkit: Open source Browser-based 3D Scientific & Medical Visualization Framework for building Web-based WebGL powered apps

The X Toolkit: Open source Browser-based 3D Scientific & Medical Visualization Framework for building Web-based WebGL powered apps

The X Toolkit is an open-source toolkit and framework for building medical and scientific 3D visualization that runs within the browser, It uses the power of WebGL to provide smooth 3D modeling, structure, and material/texture rendering with few lines of code.

Unlike other WebGL frameworks and libraries out there, The X Toolkit is a scientific & medical oriented library, It's not aiming to be a general purpose library like Three.js or WebGL gaming engine or library.

What is WebGL?


WebGL is a JavaScript API for rendering 2D/ 3D graphics within the browser without the need for extra software or plugins. WebGL leverages the GPU to render graphics smoothly within the page canvas. Imagine the complex 3D graphics of video games for native Windows, WebGL can bring similar results to the browser. However, WebGL is not a game engine so as our topic here today: The X Toolkit.

Advantage of WebGL?

  • It works on modern web browsers and hardware
  • Compatible with most of the web browsers & web browser engines
  • Does not require extra plugins/ software to install or configure
  • Use the GPU power to render the graphics

The project is sponsored by Harvard Medical School, Boston Children's Hospital, &  UMASS Boston. It is released under MIT license but also copyrighted for The X Toolkit developers.

Brain Browser

Features

  • Lightweight
  • Single file library
  • Smooth learning curve
  • Rich examples library
  • Clear API
  • Works smoothly with modern web browsers like Google Chrome, Firefox, & Safari
  • DICOM files support
  • Native reading of a variety of scientific file formats
  • Volume rendering, thresholding and cross-sectional slicing of 3d image data
  • Label maps, color tables, and surface overlays are supported
Animated Skull demo with XTK - Demo

Projects built with XTK (The X Toolkit)

The X Toolkit Demo

The X Toolkit Tutorials with examples

  • Skull 3D mesh tutorial:  A visualization of a mesh loaded from a .VTK file. (link)
  • Brain fibers: Load and render brain fibers from a .TRK file. (link)
  • Surf free: Loading freesurfer meshes and brain fibers at the same time.
  • Slice tutorial: Load a .NRRD single-file DICOM volume and a segmentation mesh from a .VTK file. (link)
  • DICOM visualization tutorial with 2D/ 3D Here we visualize a brain MR scan read from DICOM files.
  • 3D printing  with The X Toolkit
  • Multiple Camera: multiple 3D renderers are showing the same object with different camera positions.

Slice:Drop, See The X Toolkit in action

Slice:Drop Demo


Slice:Drop is an online free medical viewer that provides 3D medical visualization through the web browser with the only WebGL and with no desktop dependencies or extra software installed or configured. It's easy and simple to use web application that supports drag-and-drop 3D files to the web page then load the 3D rendered data smoothly in the web app.

Slice:Drop is completely built on XTK (The X Toolkit) using only web technologies HTML5/ JavaScript.

Supported file formats

The X Toolkit supports many file formats including DICOM files, which make it preferred to build 3D Web-based DICOM application , here is a list some  of the supported file formats:

  • DICOM files
  • .DICOM, .DCM (Raw & Compressed)
  • .MGZ
  • .MGH
  • .NII & .NII.GZ
  • .NRRD  (compressed/uncompressed auto-detection)
  • Surface Models/Mesh Files
  • .STL Standard Tessellation (ascii and binary)
  • .VTK - The Visualization Toolkit polydata (ascii only)
  • .OBJ - Wavefront .obj format
  • .FSM, .INFLATED, .SMOOTHWM, .SPHERE, .PIAL, .ORIG - Freesurfer meshes
  • Scalar Overlay Files
  • .CRV - Freesurfer Curvature measurements
  • .LABEL - Freesurfer Labels
  • Tractography
  • .TRK The default TrackVis file format for fiber tracks.
  • Other files
  • .TXT
  • Texture files: .PNG, .JPG, .JPEG, .SVG

Read more about the supported file formats here.

Resources