Home

Awesome

πŸ””πŸ””πŸ””πŸ”” Attention: Cornerstone.js has evolved! We're excited to introduce Cornerstone3D πŸš€. Expect advanced rendering, stellar performance, and a modern toolset. 🌐 Navigate to the new repository for the latest updates and improvements.

<div align="center"> <h1>cornerstone-tools</h1> <p>Provides a simple, extensible framework for creating tools on top of <a href="https://github.com/cornerstonejs/cornerstone/">Cornerstone.js</a>. Includes common tool implementations, and leverages DICOM metadata (when available) for advanced functionality.</p>

Read The Docs | Edit the docs

</div> <hr /> <!-- prettier-ignore-start -->

Build Status Coverage Status All Contributors

NPM version NPM downloads MIT License

<!-- prettier-ignore-end -->

Index

The Fun Stuff

Everything Else

The problem

Building one or two tools on top of Cornerstone.js is not that difficult. However, as the number of tools grow, you begin to encounter difficult problems:

This library solves these problems in a highly pluggable and extensible way.

This solution

cornerstone-tools is a light-weight solution for building Tools on top of Cornerstone.js. It's only dependencies are libraries within the Cornerstone family. Instead of trying to "do everything" it aims to be extensible and pluggable to aid in the rapid development of new tools. Ideally, tools created using cornerstone-tools can be easily shared, allowing for the creation of a broader ecosystem.

Example

Below is a simplified example of creating a tool by extending cornerstone-tool's BaseTool class.

import cornerstone from 'cornerstone-core';
import { BaseTool } from 'cornerstone-tools';
import basicLevelingStrategy from '...';

export default class WwwcTool extends BaseTool {
  constructor(configuration = {}) {
    const defaultConfig = {
      name: 'Wwwc',
      strategies: { basicLevelingStrategy },
      supportedInteractionTypes: ['Mouse', 'Touch'],
      configuration: {
        orientation: 0,
      },
    };
    const initialConfiguration = Object.assign(defaultConfig, configuration);

    super(initialConfiguration);
  }

  mouseDragCallback(evt) {
    this.applyActiveStrategy(evt);

    cornerstone.setViewport(evt.detail.element, evt.detail.viewport);
  }

  touchDragCallback(evt) {
    evt.stopImmediatePropagation();
    this.applyActiveStrategy(evt);

    cornerstone.setViewport(evt.detail.element, evt.detail.viewport);
  }
}

Installation

This module is distributed via npm which is bundled with node and should be installed as one of your project's dependencies:

// To install the newest version
npm install --save cornerstone-tools

// To install the legacy version (2.4.x branch)
npm install --save cornerstone-tools@2

This library has peerDependencies listings for:

If you need to support the IE11 Browser, you will need to provide polyfills as needed. Our BrowserList target:

  "browserslist": [
    "> 1%",
    "IE 11",
    "not dead",
    "not IE < 11",
    "not op_mini all"
  ]

Setting up and configuring cornerstone-tools's depency can be the biggest hurdle to getting started. Be sure to check out our docs for assistance.

Docs

Examples & Docs

The latest major version has just been published. We are still flushing out our examples. If you have anything you would like to see documented, or you want a specific example from version 2 ported, either create an issue or make a pull request ^_^

Tools

Annotation Tools

3rd Party Tool Plugins

A huge thanks to tool authors, like @sisobus, for sharing their work with the community!

Other Solutions

Contributors

Thanks goes to these people (emoji key):

<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section --> <!-- prettier-ignore -->
<img src="https://avatars2.githubusercontent.com/u/1268698?v=4" width="100px;" alt="Chris Hafey"/><br /><sub><b>Chris Hafey</b></sub><br />πŸ“– πŸ’» πŸ“ πŸ“’<img src="https://avatars3.githubusercontent.com/u/607793?v=4" width="100px;" alt="Erik Ziegler"/><br /><sub><b>Erik Ziegler</b></sub><br />πŸ’» πŸ“– πŸ‘€ 🚧 πŸš‡ πŸ’¬<img src="https://avatars1.githubusercontent.com/u/5797588?v=4" width="100px;" alt="Danny Brown"/><br /><sub><b>Danny Brown</b></sub><br />πŸ’» πŸ“– πŸ‘€ 🚧 πŸš‡ πŸ”Œ πŸ’¬<img src="https://avatars0.githubusercontent.com/u/25818497?v=4" width="100px;" alt="James Petts"/><br /><sub><b>James Petts</b></sub><br />πŸ’» πŸ‘€ πŸ”Œ πŸ“– πŸ’¬<img src="https://avatars0.githubusercontent.com/u/126077?v=4" width="100px;" alt="Steve Pieper"/><br /><sub><b>Steve Pieper</b></sub><br />πŸ’¬ πŸ”§<img src="https://avatars3.githubusercontent.com/u/1905961?v=4" width="100px;" alt="Rodrigo Antinarelli"/><br /><sub><b>Rodrigo Antinarelli</b></sub><br />πŸ’»<img src="https://avatars2.githubusercontent.com/u/10813109?v=4" width="100px;" alt="Zaid Safadi"/><br /><sub><b>Zaid Safadi</b></sub><br />πŸ’¬ πŸ’»
<img src="https://avatars3.githubusercontent.com/u/2378326?v=4" width="100px;" alt="Gustavo AndrΓ© Lelis"/><br /><sub><b>Gustavo AndrΓ© Lelis</b></sub><br />πŸ’»<img src="https://avatars1.githubusercontent.com/u/3926071?v=4" width="100px;" alt="Kofifus"/><br /><sub><b>Kofifus</b></sub><br />πŸ’» πŸ”§ πŸ›<img src="https://avatars2.githubusercontent.com/u/25580127?v=4" width="100px;" alt="AloΓ―s Dreyfus"/><br /><sub><b>AloΓ―s Dreyfus</b></sub><br />πŸ’»<img src="https://avatars0.githubusercontent.com/u/616382?v=4" width="100px;" alt="Tim Leslie"/><br /><sub><b>Tim Leslie</b></sub><br />πŸ’»<img src="https://avatars3.githubusercontent.com/u/7297450?v=4" width="100px;" alt="diego0020"/><br /><sub><b>diego0020</b></sub><br />πŸ’»<img src="https://avatars1.githubusercontent.com/u/4920551?v=4" width="100px;" alt="Evren Ozkan"/><br /><sub><b>Evren Ozkan</b></sub><br />πŸ’»<img src="https://avatars2.githubusercontent.com/u/7647745?v=4" width="100px;" alt="Salvador Daniel Pelayo"/><br /><sub><b>Salvador Daniel Pelayo</b></sub><br />πŸ’»
<img src="https://avatars3.githubusercontent.com/u/3358381?v=4" width="100px;" alt="Juan Narvaez"/><br /><sub><b>Juan Narvaez</b></sub><br />πŸ’»<img src="https://avatars0.githubusercontent.com/u/814227?v=4" width="100px;" alt="Mike"/><br /><sub><b>Mike</b></sub><br />πŸ“– πŸ’» ⚠️<img src="https://avatars2.githubusercontent.com/u/3329885?v=4" width="100px;" alt="Sangkeun Kim"/><br /><sub><b>Sangkeun Kim</b></sub><br />πŸ’» πŸ’¬<img src="https://avatars3.githubusercontent.com/u/378021?v=4" width="100px;" alt="Victor Saase"/><br /><sub><b>Victor Saase</b></sub><br />πŸ€”<img src="https://avatars2.githubusercontent.com/u/120943?v=4" width="100px;" alt="Michael Wasser"/><br /><sub><b>Michael Wasser</b></sub><br />πŸ“–<img src="https://avatars2.githubusercontent.com/u/11068601?v=4" width="100px;" alt="Amandeep Singh"/><br /><sub><b>Amandeep Singh</b></sub><br />πŸ–‹<img src="https://avatars0.githubusercontent.com/u/1474137?v=4" width="100px;" alt="Madison Dickson"/><br /><sub><b>Madison Dickson</b></sub><br />πŸ“–
<img src="https://avatars1.githubusercontent.com/u/3342530?v=4" width="100px;" alt="Kevin Lee Drum"/><br /><sub><b>Kevin Lee Drum</b></sub><br />πŸ’»<img src="https://avatars3.githubusercontent.com/u/11224291?v=4" width="100px;" alt="Makarand Bauskar"/><br /><sub><b>Makarand Bauskar</b></sub><br />πŸ’»<img src="https://avatars0.githubusercontent.com/u/1713255?v=4" width="100px;" alt="Biharck Araujo"/><br /><sub><b>Biharck Araujo</b></sub><br />πŸ’‘ πŸ“–<img src="https://avatars3.githubusercontent.com/u/5349517?v=4" width="100px;" alt="Devon Bernard"/><br /><sub><b>Devon Bernard</b></sub><br />πŸ“–<img src="https://avatars2.githubusercontent.com/u/38315992?v=4" width="100px;" alt="Karl-Heinrich"/><br /><sub><b>Karl-Heinrich</b></sub><br />πŸ› πŸ’» ⚠️<img src="https://avatars0.githubusercontent.com/u/15172026?v=4" width="100px;" alt="counterxing"/><br /><sub><b>counterxing</b></sub><br />πŸ› πŸ’»<img src="https://avatars0.githubusercontent.com/u/50026015?v=4" width="100px;" alt="Jorge Lopes"/><br /><sub><b>Jorge Lopes</b></sub><br />πŸ’¬
<img src="https://avatars2.githubusercontent.com/u/5546851?v=4" width="100px;" alt="Gabriel Garrido"/><br /><sub><b>Gabriel Garrido</b></sub><br />πŸ’»<img src="https://avatars0.githubusercontent.com/u/4126256?v=4" width="100px;" alt="ASVBPREAUBV"/><br /><sub><b>ASVBPREAUBV</b></sub><br />πŸ“–<img src="https://avatars0.githubusercontent.com/u/50960211?v=4" width="100px;" alt="frolic06"/><br /><sub><b>frolic06</b></sub><br />πŸ’»<img src="https://avatars2.githubusercontent.com/u/26968918?v=4" width="100px;" alt="codepage949"/><br /><sub><b>codepage949</b></sub><br />πŸ’»<img src="https://avatars.githubusercontent.com/u/1915?v=4" width="100px;" alt="Asherah Connor"/><br /><sub><b>Asherah Connor</b></sub><br />πŸ’»<img src="https://avatars.githubusercontent.com/u/22633385?v=4" width="100px;" alt="Ikko Ashimine"/><br /><sub><b>Ikko Ashimine</b></sub><br />πŸ›<img src="https://avatars.githubusercontent.com/u/27778909?v=4" width="100px;" alt="Bill Wallace"/><br /><sub><b>Bill Wallace</b></sub><br />πŸ’» πŸ“–
<img src="https://avatars.githubusercontent.com/u/3341923?v=4" width="100px;" alt="Bruno Alves de Faria"/><br /><sub><b>Bruno Alves de Faria</b></sub><br />πŸ› πŸ’» πŸ–‹ πŸ“– πŸ”Œ πŸ‘€ ⚠️ πŸ”§ πŸ““<img src="https://avatars.githubusercontent.com/u/13886933?v=4" width="100px;" alt="Igor Octaviano"/><br /><sub><b>Igor Octaviano</b></sub><br />πŸ’» πŸ“– 🚧 πŸ‘€ πŸ““
<!-- ALL-CONTRIBUTORS-LIST:END -->

This project follows the all-contributors specification. Contributions of any kind welcome!

Issues

Looking to contribute? Look for the Good First Issue label.

πŸ› Bugs

Please file an issue for bugs, missing documentation, or unexpected behavior.

See Bugs

πŸ’‘ Feature Requests

Please file an issue to suggest new features. Vote on feature requests by adding a πŸ‘. This helps maintainers prioritize what to work on.

❓ Questions

For questions related to using the library, please visit our support community, or file an issue on GitHub.

LICENSE

MIT

<!-- Links: --> <!-- prettier-ignore-start --> <!-- prettier-ignore-end -->