OHIF Viewer

A screenshot of OHIF Viewer. Source: OHIF 2023a.
A screenshot of OHIF Viewer. Source: OHIF 2023a.

Doctors and other medical professionals use software to view, analyse and annotate images of patients. These images could be X-rays, ultrasound/CT/PET/MRI scans, ECG/EEG waves and more. There are both commercial as well as open source viewers for this purpose. Among the open source viewers is OHIF Viewer. It's development is guided by the Open Health Imaging Foundation (OHIF).

The OHIF Viewer is configurable and extensible. It's a web application that can be used without additional software installation. It can load images from various sources or interfaces including DICOMweb. Images can be rendered in 2D, 3D or restructured representations. For authentication it supports OpenID Connect. The app is built in React using reusable UI components.

Discussion

  • Could you give an overview of OHIF Viewer?
    A typical radiology workflow. Source: Dikici et al. 2019, fig. 2.
    A typical radiology workflow. Source: Dikici et al. 2019, fig. 2.

    Let's consider a radiology workflow as an example. Via CT or MRI scans of patients, images are acquired. These images are in DICOM (Digital Imaging and Communications in Medicine) format. They're sent to a DICOM router that checks the integrity of these images. From here the images are sent to Picture Archiving and Communication System (PACS) and Vendor-Neutral Archive (VNA). An example of PACS is Orthanc, a DICOM server with REST API and a web UI.

    Radiologists access the images in PACS from their workstations or other devices for visualization, post-processing or analysis. Non-radiologists can access images from VNA via patient Electronic Medical Record (EMR). The figure above shows a case where this traditional workflow is being augmented with AI capabilities.

    Traditional medical imaging software were often desktop applications that needed to be installed and maintained by IT staff. When problems arose, such applications were hard to debug remotely. It's in this context that web-based applications enabled by cloud computing became attractive. The OHIF Viewer is one such viewer.

  • What are the main features of OHIF Viewer?

    The viewer includes two essential features: visualization and annotation. For visualization, multi-modal image fusion, maximum intensity projection, multi-planar reformatting, axial/sagittal/coronal views, CINE view, and many more are supported. For annotation, there are many easy-to-use tools for measurement and annotation. Touch-specific tools such as pinch-to-zoom become handy on touchscreen devices.

    In terms of software architecture and design, the viewer is built using reusable React UI components. This enables developers to compose more sophisticated components and custom workflows without needing to code them from scratch. Since code is open source, these components can be studied and customized as needed. The viewer is really a web application that runs within a web browser. Hence, no additional software needs to be installed to use it.

    For performance, GPU acceleration is used for image rendering. Multi-threading enables quick image decoding.

    The viewer is standards-compliant: DICOMweb for image data access, OpenID Connect for authorized access to data. The viewer can connect other sources as well.

    For deployment, the viewer can be a standalone web application. Alternatively, it can be embedded via a <script> tag into another application but this got deprecated in version 3.

  • What's the architecture of OHIF Viewer?
    Architecture of OHIF Viewer. Source: OHIF 2022d, slide 7.
    Architecture of OHIF Viewer. Source: OHIF 2022d, slide 7.

    The OHIF Viewer adopts a modular architecture. The main platform has the following components:

    • core: Core libraries that implement medical imaging functions (aka business logic) for the web.
    • i18n: Internationalization support.
    • viewer: This brings together the all components. To register extensions, compose modes and route requests are its main functions.
    • ui: React component library.
    • extensions: Libraries that implement essential functionalities such as rendering, measurement tracking, etc. These are the building blocks. They're consumed by modes.
    • modes: A configuration to compose extensions and routes to make an application.

    OHIF Viewer makes use of other projects such as Cornerstone. It's a set of JavaScript libraries specific to the medical domain. Cornerstone also include libraries to load DICOM objects over the web, called WADO (Web Access to DICOM Objects). There's support for the older WADO-URI interface and the more modern WADO-RS aka DICOMweb (RESTful API). The loader uses web workers for CPU intensive image processing tasks. It uses OpenJPEG library. Library dcmjs does DICOM manipulation in JavaScript.

  • What are modes in OHIF Viewer?
    The composition of a mode or a mini app. Source: OHIF 2022e.
    The composition of a mode or a mini app. Source: OHIF 2022e.

    The OHIF Viewer contains many extensions but often not all of them are needed for a specific workflow. For example, 3D segmentation has different requirements compared to tracking measurements over time. Other specific workflows are ECG viewer and total metabolic tumor volume. These different workflows are enabled via modes. In one sense, modes enable many mini-apps or workflows within a single app.

    Modes use extensions. Modes register workflows with the viewer with certain routes. The mode will get invoked once user accesses the viewer on a registered route. Modes essentially offer a lot of flexibility to create new workflows while reusing existing extensions. Modes were introduced in version 3. In version 2 of the viewer, we had to build new UI and extensions to create new workflows.

    The figure shows the composition of "AI Organ Segmentation" mode. It configures the applicable routes and extensions. It uses the applicable layout templates and data sources. Mode-specific props are passed to the templates. For each study, the viewer will show available modes. A study can have multiple modes.

  • Could you do a code walkthrough of OHIF Viewer?

    We describe the codebase with respect to commit beb451745 (December 2022). Paths to the components are configured in tsconfig.json. For example, the viewer component is at platform/viewer/src. At this path we find index.js where the application object is created. This object is inserted into the DOM at the element with ID "root". The HTML template for this is at platform/viewer/public/html_templates/index.html.

    For interfacing to a DICOMweb server, the configuration files are at platform/viewer/public/config folder. Data is requested via the extension extensions/cornerstone/src/utils/dicomLoaderServer.js. Web workers are initialized in extensions/cornerstone/src/initWADOImageLoader.js.

    The default mode is configured in modes/basic-dev-mode/src/index.js. Modes are set up for the app in platform/viewer/src/appInit.js.

    Reusable React components are in platform/ui/src/components. As an example, we note that ToolbarButton is built from three other components, Tooltip, IconButton and Icon. Some extensions make use of ToolbarButton to compose a complete toolbar.

  • What developer resources are available to work with OHIF Viewer?

    The project's main website has links to documentation, examples, and more. Beginners may want to explore a demo of the software first.

    The source code is available on GitHub. We can clone this code repository and build a Docker image of the viewer. Alternatively, we can use the viewer's Docker image from Docker Hub.

    An easier way to use OHIF Viewer is as a cloud-based managed service. SpringML's One-Click DICOM Viewer is an example that's easily deployed on the Google Cloud. It uses Google Kubernetes Engine.

    Perhaps the easiest method is to embed the viewer via a script tag into your own custom application.

    OHIF Viewer is capable of invoking DICOMweb REST APIs. A cheatsheet of DICOMweb is a useful reference.

    OHIF Viewer uses Cornerstone. It's a set of JavaScript libraries to display medical images, or develop tools and applications for medical imaging.

Milestones

Sep
2015
OHIF Viewer v1 demo showing the use of web workers. Source: OHIF 2016, slide 20.
OHIF Viewer v1 demo showing the use of web workers. Source: OHIF 2016, slide 20.

Dr. Gordon Harris at the Massachusetts General Hospital receives funding for the project from a National Cancer Institute U24 grant. This funding continues till August 2020. Version 1 of the software starts life in 2015 and is active till 2019. It's uses Meteor full-stack framework. Version 1 is actually three separate apps: LesionTracker, OHIF Viewer, and OHIF Standalone Viewer.

2018

XNAT integrates OHIF Viewer within its environment. XNAT is a platform for quantitative imaging studies. This evolves as new versions of the viewer are released in later years: XNAT-OHIF 2.0 (2019) and XNAT-OHIF 3.2.0 (2021). This is just one example of other projects adopting OHIF Viewer.

2019

OHIF Viewer v2 is released. It's a single React app. It deprecates the Meteor backend. Version 2 remains in active development till 2021. The viewer's extension architecture is one of the features in this version. Others include 3D multiplanar reformatting (MPR), DICOM segmentation, and PDF visualization.

Apr
2019

Release v0.0.19 of OHIF Viewer occurs via it's code repository on GitHub. This is the first release via GitHub. Semantic versioning of the project starts here. In May, v0.1.0 is released. From August, each package is released separately since this is a monorepo. For example, @ohif/core@0.11.1-alpha.8 and @ohif/extension-cornerstone@0.0.39-alpha.8 are released in August, each with its own release numbering.

Nov
2020

The Chan Zuckerberg Initiative selects both OHIF and Cornerstone projects for funding. The funds would go towards better documentation, software maintenance and community outreach. Funding begins in 2021. In August 2021, the Chan Zuckerberg Initiative partners with hack.diversity to develop new training material, and provide guidance and mentorship to contributors working on these projects. This funding is renewed in 2022.

Sep
2021

OHIF Viewer v3 Public Beta is released. This is a departure from the Meteor-based v1 and current React-based version v2. The app is still in React but has a new UI component library that uses Tailwind CSS. Via a major re-architecture, modes are introduced. Extensions in v2 were hard to maintain. Modes assemble extensions via a more modular approach.

Aug
2022

At a OHIF Viewer demo and presentation, it's reported that the software will evolve to support advanced features. These include hanging protocols, volume rendering, rendering of arbitrary stack of images, rendering of colour images, videos, ECG viewer, pathology viewer, etc.

Nov
2022

OHIF Viewer v3.3 is released. Among the new features are DICOM segmentation, multiplanar reformatting (MPR), synchronized scrolling, and reference lines. DICOM segments, rendered in 3D, are for display only and can't be edited. MPR feature uses Cornerstone3D VolumeViewports feature. Project will continue to look at bug fixes on v2-stable branch but will focus on v3-stable branch for the long term. This release also deprecates the Embedded Viewer.

References

  1. Chan Zuckerberg Initiative. 2020. "Enhancing the Open Health Imaging Foundation Web Medical Imaging Framework." Chan Zuckerberg Initiative, November 19. Accessed 2023-03-02.
  2. Chan Zuckerberg Initiative. 2021. "Open Health Imaging Foundation (OHIF) and Cornerstone Medical Web Viewer." Chan Zuckerberg Initiative, August 8. Updated 2021-08-31. Accessed 2023-03-02.
  3. Cornerstone. 2023a. "Homepage on GitHub." cornerstone.js. Accessed 2023-03-02.
  4. Cornerstone. 2023b. "Cornerstone WADO Image Loader." cornerstonejs/cornerstoneWADOImageLoader, on GitHub, February 21. Accessed 2023-03-02.
  5. DICOM. 2019a. "Retrieve (WADO-RS)." DICOM Standard, December 17. Updated 2021-01-12. Accessed 2023-03-02.
  6. DICOM. 2019b. "DICOMweb™." DICOM, December 17. Updated 2022-09-02. Accessed 2023-03-02.
  7. Dikici, E., Matthew Bigelow, Luciano M. Prevedello, Richard D. White, and Barbaros Selnur Erdal. 2019. "Integrating AI into Radiology workflow: Levels of research, production, and feedback maturity." arXiv, v1, October 14. Accessed 2023-03-02.
  8. Doran, Simon J., Mohammad Al Sa'd, James A. Petts, James Darcy, Kate Alpert, Woonchan Cho, Lorena Escudero Sanchez, Sachidanand Alle, Ahmed El Harouni, Brad Genereaux, Erik Ziegler, Gordon J. Harris, Eric O. Aboagye, Evis Sala, Dow-Mu Koh, and Dan Marcus. 2022. "Integrating the OHIF Viewer into XNAT: Achievements, Challenges and Prospects for Quantitative Imaging Studies." Tomography, vol. 8, no. 1, pp. 497-512. doi: 10.3390/tomography8010040. Accessed 2023-03-02.
  9. I Do Imaging. 2019. "Orthanc: Lightweight cross-platform DICOM server with REST API." I Do Imaging. Accessed 2023-03-02.
  10. InsideView. 2019. "Different Imaging Tests, Explained." Blog, InsideView, UVA Radiology and Medical Imaging, September 17. Accessed 2023-03-02.
  11. Lacerda, C. 2020. "Integrating AI into Clinical Workflow with Orthanc and OHIF Viewer." On Medium, September 13. Accessed 2023-03-02.
  12. Lewis, R. 2022. "Three New Things You Can Now Do Using OHIF v3." Blog, Radical Imaging, August 11. Accessed 2023-02-03.
  13. Mousa, H. 2019. "15 Best Open-source Web-based DICOM Viewers." MEDevel, June 19. Accessed 2023-03-02.
  14. OHIF. 2016. "Community Forum." Slides, OHIF, September 28. Accessed 2023-03-02.
  15. OHIF. 2021. "OHIF v3 Public Beta Launch." News, September 14. Accessed 2023-03-02.
  16. OHIF. 2022a. "OHIF Viewer v3.3." News, November 21. Accessed 2023-03-02.
  17. OHIF. 2022b. "Cornerstone3D Public Beta Release." News, April 6. Accessed 2023-03-02.
  18. OHIF. 2022c. "Open Health Imaging Foundation Updates." Slides, OHIF, SIIM 2022 Annual Meeting, Austin, TX, June 14-16. Accessed 2023-03-02.
  19. OHIF. 2022d. "Open Health Imaging Foundation Viewer." Slides, OHIF Demo, August. Accessed 2023-02-03.
  20. OHIF. 2022e. "Modes." Documentation, OHIF Viewer, v3.3, November 16. Accessed 2023-03-02.
  21. OHIF. 2022f. "Deployment." Documentation, OHIF Viewer, v3.3, December 29. Accessed 2023-03-02.
  22. OHIF. 2022g. "Architecture." Documentation, OHIF Viewer, v3.3, July 27. Accessed 2023-03-03.
  23. OHIF. 2022h. "Config files." Documentation, OHIF Viewer, v3.3, November 16. Accessed 2023-03-04.
  24. OHIF. 2023a. "Homepage." Open Health Imaging Foundation. Accessed 2023-03-02.
  25. OHIF. 2023b. "OHIF Modes." Open Health Imaging Foundation. Accessed 2023-03-02.
  26. OHIF. 2023c. "OHIF Medical Imaging Viewer." OHIF/Viewers, on GitHub, January 17. Accessed 2023-03-02.
  27. OHIF. 2023d. "Releases." OHIF/Viewers, on GitHub. Accessed 2023-03-02.
  28. OHIF. 2023e. "ECG Viewer Mode." Open Health Imaging Foundation. Accessed 2023-03-02.
  29. Oosterwijk, H. 2018. "DICOMWeb, what is it and how can it be used?" White paper, OTech. Accessed 2023-03-02.
  30. SpringML. 2020. "SpringML’s Managed OHIF DICOM Viewer." Press release, SpringML, October 13. Updated 2022-07-28. Accessed 2023-03-02.
  31. XNAT. 2019. "XNAT OHIF Viewer 2.0 Plugin Released." Blog, XNAT, August 2. Accessed 2023-03-02.
  32. Ziegler, E., T. Urban, D. Brown, J. Petts, S. D. Pieper, R. Lewis, C. Hafey, and G. J. Harris. 2020. "Open Health Imaging Foundation Viewer: An Extensible Open-Source Framework for Building Web-Based Imaging Applications to Support Cancer Research." JCO Clinical Cancer Informatics, vol. 4, pp. 336–345, April. doi: 10.1200/CCI.19.00131. Accessed 2023-03-02.
  33. dcmjs. 2023. "dcmjs." v0.29.4, on npm, January 13. Accessed 2023-03-03.
  34. postDICOM. 2023. "Top 25 Free Dicom Viewers for Doctors, Medical Students, and Health Professionals." Blog, postDICOM. Accessed 2023-03-02.

Further Reading

  1. OHIF Viewer v3 Documentation
  2. Ziegler, E., T. Urban, D. Brown, J. Petts, S. D. Pieper, R. Lewis, C. Hafey, and G. J. Harris. 2020. "Open Health Imaging Foundation Viewer: An Extensible Open-Source Framework for Building Web-Based Imaging Applications to Support Cancer Research." JCO Clinical Cancer Informatics, vol. 4, pp. 336–345, April. doi: 10.1200/CCI.19.00131. Accessed 2023-03-02.
  3. OHIF. 2022c. "Open Health Imaging Foundation Updates." Slides, OHIF, SIIM 2022 Annual Meeting, Austin, TX, June 14-16. Accessed 2023-03-02.
  4. CARPL.AI. 2020. "A What, When and Where Guide on Open Source DICOM viewers for Radiologists." CARPL.AI, January 20. Accessed 2023-03-02.
  5. Björn, K. 2017. "Evaluation of Open Source Medical Imaging Software: A Case Study on Health Technology Student Learning Experience." CENTERIS/ProjMAN/HCist 2017, Barcelona, Spain, November 8-10. Accessed 2023-03-02.
  6. Kapoor, C., S. Gupta, V. Venugopal, V. Mahajan, and H. Mahajan. 2020. "A What, When and Where Guide on Open Source DICOM viewers for Radiologists." Poster C-14260, ECR 2020. Accessed 2023-03-02.

Article Stats

Author-wise Stats for Article Edits

Author
No. of Edits
No. of Chats
DevCoins
Avatar of user arvindpdmn arvindpdmn
5
0
1655
DevCoins due to articles, chats, their likes and article hits are included.
1640
Words
1
Authors
5
Edits
1
Chats
7
Likes
5732
Hits

Cite As

Devopedia. 2023. "OHIF Viewer." Version 5, March 4. Accessed 2024-06-25. https://devopedia.org/ohif-viewer
Contributed by
1 author

Last updated on
2023-03-04 17:22:37
web tools react medical

See Also

  • DICOMweb
  • Orthanc
  • Picture Archiving and Communication System
  • Vendor Neutral Archive
  • XNAT
  • React