{"id":13812531,"url":"https://github.com/ImagingDataCommons/dicom-microscopy-viewer","last_synced_at":"2025-05-14T22:30:47.031Z","repository":{"id":37678786,"uuid":"142499554","full_name":"ImagingDataCommons/dicom-microscopy-viewer","owner":"ImagingDataCommons","description":"Web-based DICOM slide microscopy viewer library","archived":false,"fork":false,"pushed_at":"2025-05-07T15:43:40.000Z","size":4254,"stargazers_count":109,"open_issues_count":13,"forks_count":39,"subscribers_count":10,"default_branch":"master","last_synced_at":"2025-05-13T09:08:21.404Z","etag":null,"topics":["dicom","dicom-json","dicomweb","idc-viewers","javascript","npm","openlayers"],"latest_commit_sha":null,"homepage":"https://imagingdatacommons.github.io/dicom-microscopy-viewer/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ImagingDataCommons.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-07-26T22:18:57.000Z","updated_at":"2025-05-07T14:56:38.000Z","dependencies_parsed_at":"2024-05-28T19:23:32.865Z","dependency_job_id":"7c081b60-edca-4849-9298-fa4e34ccde9b","html_url":"https://github.com/ImagingDataCommons/dicom-microscopy-viewer","commit_stats":null,"previous_names":["herrmannlab/dicom-microscopy-viewer","mghcomputationalpathology/dicom-microscopy-viewer"],"tags_count":67,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ImagingDataCommons%2Fdicom-microscopy-viewer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ImagingDataCommons%2Fdicom-microscopy-viewer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ImagingDataCommons%2Fdicom-microscopy-viewer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ImagingDataCommons%2Fdicom-microscopy-viewer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ImagingDataCommons","download_url":"https://codeload.github.com/ImagingDataCommons/dicom-microscopy-viewer/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254239454,"owners_count":22037713,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["dicom","dicom-json","dicomweb","idc-viewers","javascript","npm","openlayers"],"created_at":"2024-08-04T04:00:52.967Z","updated_at":"2025-05-14T22:30:46.993Z","avatar_url":"https://github.com/ImagingDataCommons.png","language":"JavaScript","readme":"[![Build Status](https://github.com/imagingdatacommons/dicom-microscopy-viewer/actions/workflows/run_unit_tests.yml/badge.svg)](https://github.com/imagingdatacommons/dicom-microscopy-viewer/actions)\n[![NPM version](https://badge.fury.io/js/dicom-microscopy-viewer.svg)](http://badge.fury.io/js/dicom-microscopy-viewer)\n![NPM downloads per month](https://img.shields.io/npm/dm/dicom-microscopy-viewer?color=blue)\n\n# DICOM Microscopy Viewer\n\nVanilla JS library for web-based visualization of [DICOM VL Whole Slide Microscopy Image](http://dicom.nema.org/medical/dicom/current/output/chtml/part03/sect_A.32.8.html) datasets and derived information.\n\nThe viewer allows visualization of slide microscopy images stored in a [DICOMweb](https://www.dicomstandard.org/dicomweb/) compatible archive.\nIt leverages the [dicomweb-client](https://github.com/dcmjs-org/dicomweb-client) JavaScript library to retrieve data from the archive.\n\n## Features\n\n* Display of different image types: `VOLUME`/`THUMBNAIL`, `OVERVIEW`, `LABEL`\n* Annotation of regions of interest (ROI) as vector graphics based on 3-dimensional spatial coordinates (SCOORD3D): `POINT`, `MULTIPOINT`, `POLYLINE`, `POLYGON`, `ELLIPSE`, `ELLIPSOID`\n* Assembly of concatenations\n* Decoding of compressed pixel data, supporting baseline JPEG, JPEG 2000, and JPEG-LS codecs\n* Correction of color images using ICC profiles\n* Additive blending and coloring of monochromatic images of multiple optical paths (channels), supporting highly-multiplexed immunofluorescence imaging\n* Overlay of image analysis results in the form of [DICOM Segmentation](https://dicom.nema.org/medical/dicom/current/output/chtml/part03/sect_A.51.html), [Parametric Map](https://dicom.nema.org/medical/dicom/current/output/chtml/part03/sect_A.75.html), [Comprehensive 3D SR](https://dicom.nema.org/medical/dicom/current/output/chtml/part03/sect_A.35.13.html), or [Microscopy Bulk Simple Annotations](https://dicom.nema.org/medical/dicom/current/output/chtml/part03/sect_A.87.html)\n\n## Documentation\n\nDocumentation of the JavaScript Application Programming Interface (API) is available online at [imagingdatacommons.github.io/dicom-microscopy-viewer](https://imagingdatacommons.github.io/dicom-microscopy-viewer/).\n\n## Getting started\n\nNote that the *dicom-microscopy-viewer* package is **not** a viewer application, it is a library to build viewer applications.\n\nBelow is an example for the most basic usage: a web page that displays a collection of DICOM VL Whole Slide Microscopy Image instances of a digital slide.\nFor more advanced usage, take a look at the [Slim](https://github.com/imagingdatacommons/slim) viewer.\n\n## Packaging\n \n The library is packaged as two different builds, one using dynamic import, and the other bundling into one \n larger library.  The dynamic import version uses a public path of `/dicom-microscopy-viewer/` so that they can be used by simply adding an alias to the appropriate version, and then deploying that version.  In a straight web application, this can be loaded as:\n \n ```javascript\n    const DICOMMicroscopyViewer = (await('/dicom-microscopy-viewer/dicomMicroscopyViewer.min.js')).default\n ```\n \n The point of using the sub-directory here is to isolate the dependencies that unique to `dicom-microscopy-viewer`.\n \n \n### Basic usage\n\nThe viewer can be embedded in any website, one only needs to\n\n* Create an instance of [VolumeImageViewer](https://imagingdatacommons.github.io/dicom-microscopy-viewer/viewer.VolumeImageViewer.html). The constructor requires an instance of `DICOMwebClient` for retrieving frames from the archive as well as the metadata for each DICOM image as an instance of [VLWholeSlideMicroscopyImage](https://imagingdatacommons.github.io/dicom-microscopy-viewer/metadata.VLWholeSlideMicroscopyImage.html).\n\n* Call the `render()` method, passing it the HTML element (or the name of the element), which shall contain the viewport.\n\n```js\nimport * as DICOMMicroscopyViewer from 'dicom-microscopy-viewer';\nimport * as DICOMwebClient from 'dicomweb-client';\n\n// Construct client instance\nconst client = new DICOMwebClient.api.DICOMwebClient({\n  url: 'http://localhost:8080/dicomweb'\n});\n\n// Retrieve metadata of a series of DICOM VL Whole Slide Microscopy Image instances\nconst retrieveOptions = {\n  studyInstanceUID: '1.2.3.4',\n  seriesInstanceUID: '1.2.3.5'\n};\nclient.retrieveSeriesMetadata(retrieveOptions).then((metadata) =\u003e {\n  // Parse, format, and filter metadata\n  const volumeImages = []\n  metadata.forEach(m =\u003e {\n    const image = new DICOMMicroscopyViewer.metadata.VLWholeSlideMicroscopyImage({\n      metadata: m\n    })\n    const imageFlavor = image.ImageType[2]\n    if (imageFlavor === 'VOLUME' || imageFlavor === 'THUMBNAIL') {\n      volumeImages.push(image)\n    }\n  })\n\n  // Construct viewer instance\n  const viewer = new DICOMMicroscopyViewer.viewer.VolumeViewer({\n    client,\n    metadata: volumeImages\n  });\n\n  // Render viewer instance in the \"viewport\" HTML element\n  viewer.render({ container: 'viewport' });\n});\n```\n\n\n## Citation\n\nPlease cite the following article when using the viewer for scientific studies: [Herrmann et al. J Path Inform. 2018](http://www.jpathinformatics.org/article.asp?issn=2153-3539;year=2018;volume=9;issue=1;spage=37;epage=37;aulast=Herrmann):\n\n```None\n@article{jpathinform-2018-9-37,\n    Author={\n        Herrmann, M. D. and Clunie, D. A. and Fedorov A. and Doyle, S. W. and Pieper, S. and\n        Klepeis, V. and Le, L. P. and Mutter, G. L. and Milstone, D. S. and Schultz, T. J. and\n        Kikinis, R. and Kotecha, G. K. and Hwang, D. H. and Andriole, K, P. and Iafrate, A. J. and\n        Brink, J. A. and Boland, G. W. and Dreyer, K. J. and Michalski, M. and\n        Golden, J. A. and Louis, D. N. and Lennerz, J. K.\n    },\n    Title={Implementing the {DICOM} standard for digital pathology},\n    Journal={Journal of Pathology Informatics},\n    Year={2018},\n    Number={1},\n    Volume={9},\n    Number={37}\n}\n```\n\n## Installation\n\nInstall the [dicom-microscopy-viewer](https://www.npmjs.com/package/dicom-microscopy-viewer) package using the `npm` package manager:\n\n```None\nnpm install dicom-microscopy-viewer\n```\n\n## Development \u0026 Testing\n\nWe use [Babel](https://babeljs.io/) to compile (transpile), [webpack](https://webpack.js.org/) to bundle, and [Jest](https://github.com/facebook/jest) to test JavaScript code.\n\nGet the source code by cloning the git repository:\n\n```None\ngit clone https://github.com/imagingdatacommons/dicom-microscopy-viewer\ncd dicom-microscopy-viewer\n```\n\nInstall dependencies and build the package:\n\n```None\nnpm install\nnpm run build\n```\n\nRun tests:\n\n```None\nnpm run test\n```\n\nBuild the API documentation:\n\n```None\nnpm run generateDocs\n```\n\n## Support\n\nThe developers gratefully acknowledge their reseach support:\n* [Open Health Imaging Foundation (OHIF)](http://ohif.org)\n* [Quantitative Image Informatics for Cancer Research (QIICR)](http://qiicr.org)\n* [Radiomics](http://radiomics.io)\n* [Imaging Data Commons (IDC)](https://datacommons.cancer.gov/repository/imaging-data-commons)\n* [Neuroimage Analysis Center](http://nac.spl.harvard.edu)\n* [National Center for Image Guided Therapy](http://ncigt.org)\n* [MGH \u0026 BWH Center for Clinical Data Science (CCDS)](https://www.ccds.io/)\n\n## Acknowledgments\n\nThis software is maintained by the Imaging Data Commons (IDC) team, which has been funded in whole or\nin part with Federal funds from the NCI, NIH, under task order no. HHSN26110071\nunder contract no. HHSN261201500003l.\n\nNCI Imaging Data Commons (IDC) (https://imaging.datacommons.cancer.gov/) is a cloud-based environment \ncontaining publicly available cancer imaging data co-located with analysis and exploration tools and resources. \nIDC is a node within the broader NCI Cancer Research Data Commons (CRDC) infrastructure that provides secure \naccess to a large, comprehensive, and expanding collection of cancer research data.\n\nLearn more about IDC from this publication:\n\n\u003e Fedorov, A., Longabaugh, W. J. R., Pot, D., Clunie, D. A., Pieper, S. D.,\n\u003e Gibbs, D. L., Bridge, C., Herrmann, M. D., Homeyer, A., Lewis, R., Aerts, H.\n\u003e J. W., Krishnaswamy, D., Thiriveedhi, V. K., Ciausu, C., Schacherer, D. P.,\n\u003e Bontempi, D., Pihl, T., Wagner, U., Farahani, K., Kim, E. \u0026 Kikinis, R.\n\u003e _National Cancer Institute Imaging Data Commons: Toward Transparency,\n\u003e Reproducibility, and Scalability in Imaging Artificial Intelligence_.\n\u003e RadioGraphics (2023). https://doi.org/10.1148/rg.230180\n","funding_links":[],"categories":["Libraries"],"sub_categories":["JavaScript"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FImagingDataCommons%2Fdicom-microscopy-viewer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FImagingDataCommons%2Fdicom-microscopy-viewer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FImagingDataCommons%2Fdicom-microscopy-viewer/lists"}