ohif-viewer/docs/latest/extensions/modules/viewport.md
Danny Brown 02572b4928
docs: extensions (#1258)
* docs: process docs to include UX Stories requirement

* docs: include note regarding different environments

* Services init

* Remove unused canny logos

* docs: add ModalService diagram

* docs: GIF of notification

* docs: add ui-services page

* docs: simplify ui services call out in the general services docs

* docs: tips and tricks for UI services

* docs: moar pages

* docs: dialog gif

* docs: services in summary/sidebar

* docs: gif examples at top of dialog and notification pages

* docs: add UIModal gif

* docs: details for Dialog Service

* docs: include usage information for ui modal service

* docs: detailed information about our UI Notification Service

* docs: services diagram

* docs: remove unused links

* docs: services example and image

* docs: stubbing extension pages

* docs: UX Stories --> User Cases

* chore: eslint fix

* docs: extensions overview + diagram

* docs: update extensions in sidebar

* docs: extension skeleton and registration info

* docs: copy of maintained extensions table partial in the extensions folder

* docs: swap out old extensions structure for new
2019-12-06 16:31:46 -05:00

976 B

Module: Viewport

An extension can register a Viewport Module by providing a getViewportModule() method that returns a React Component. The React component will receive the following props:

children: PropTypes.arrayOf(PropTypes.element)
studies: PropTypes.object,
displaySet: PropTypes.object,
viewportData: PropTypes.object, // { studies, displaySet }
viewportIndex: PropTypes.number,
children: PropTypes.node,
customProps: PropTypes.object

Viewport components are managed by the ViewportGrid Component. Which Viewport component is used depends on:

  • The Layout Configuration
  • Registered SopClassHandlers
  • The SopClassUID for visible/selected datasets

Cornerstone Viewport

An example of three Viewports

For a complete example implementation, check out the OHIFCornerstoneViewport.