UNPKG

react-med-img-viewer

Version:

React component for medical image visualization. Interacts with the med-img server

63 lines (43 loc) 1.62 kB
# react-med-img-viewer > Visualize an image on the web/electron.js [![NPM](https://img.shields.io/npm/v/react-med-img-viewer.svg)](https://www.npmjs.com/package/react-med-img-viewer) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com) ## Install ```bash npm install --save react-med-img-viewer ``` ``` export NODE_OPTIONS=--max_old_space_size=8192 ``` ## Usage ```jsx import {MedImgViewer, MedImgReader} from 'react-med-img-viewer'; ``` If you like to control the layout using a button toolbar to show different layouts set `showToolBar` to 1. ```jsx <MedImgViewer vtkImagePrimary={vtkImagePrimary} style={{padding: 0}} showToolBar={1}/> ``` You can fix the layout by using the prop `selectedLayout` ```jsx <MedImgViewer selectedLayout="3" vtkImagePrimary={vtkImagePrimary}/> ``` ## Reading an image The MedImgReader works for the electron environment. If you like to know how to read your image using itk.js on the browser, please follow the instructions at [itk.js](https://insightsoftwareconsortium.github.io/itk-js/examples/webpack.html) The MedImgViewer receives a vtkImage and displays it. ```jsx var medImgReader = new MedImgReader(); //filename is the path on disk. const self = this; return medImgReader.readImage(filename) .then(function(itkImage){ return medImgReader.convertToVtkImage(itkImage); }) .then(function(vtkImage){ self.setState({...self.state, vtkImagePrimary: vtkImage}); }) .catch(function(e){ console.error(e); }); ``` ## License MIT © [juanprietob](https://github.com/juanprietob)