Giter VIP home page Giter VIP logo

ohif / vtkplugin Goto Github PK

View Code? Open in Web Editor NEW
35.0 24.0 18.0 75 KB

OHIF Plugin for The Visualization Toolkit (VTK)

Home Page: https://vtk-plugin.ohif.org?url=https://s3.eu-central-1.amazonaws.com/ohif-viewer/JSON/PTCTStudy.json

License: MIT License

JavaScript 97.21% Shell 2.79%
nci-itcr nci-qin quantitative-imaging imaging-informatics image-analysis medical-image-processing ohif-plugin

vtkplugin's Introduction

OHIF VTK Plugin

Usage

OHIF Plugin for The Visualization Toolkit (VTK)

  1. Load the OHIF Viewer on a study
  2. Paste the following into your JavaScript console to define the plugin and load the scripts.
var plugin = {
    name: "VolumeRenderingPlugin",
    url: "https://cdn.rawgit.com/OHIF/VTKPlugin/master/volumeRendering/main.js",
    allowCaching: false,
    moduleURLs: [
    	"https://cdn.rawgit.com/OHIF/VTKPlugin/master/lib/index.js",
    ],
    scriptURLs: [
        'https://unpkg.com/vtk.js',
    ]
};
OHIF.plugins.OHIFPlugin.reloadPlugin(plugin);
  1. Switch a viewport to use the plugin by specifying its viewport index:
OHIF.plugins.VolumeRenderingPlugin.setViewportToPlugin(0)

Development

This will install a local copy of the OHIFViewer and let you run a server that can be used for plugin development.

You will get:

  • a local scratch copy of the OHIF StandaloneViewer running on port 3000
  • a web server to serve your plugin code on port 8000
  • sample data from the links below will be pulled from public data stored on Amazon S3

Prerequisites

  • Run on a linux/mac environment with bash (windows not supported or tested)
  • All the things needed to build OHIFViewers
  • http-server
  1. Create a copy of the OHIF Standalone Viewer Meteor app (i.e. not built into a static site yet)
./setupDevSite.sh
  1. Install an HTTP server which supports CORS:
# If you get some EACCESS errors, use sudo.
npm install http-server -g
  1. Start the HTTP server with CORS enabled
  • You will see some logs in your console whenever requests reach your server at http://localhost:8000
  • This serves the plugin directory itself, so any changes you make to the plugin are instantly available.
http-server -p 8000 --cors
  1. Open another terminal tab and start the Standalone Viewer.
./startDevSite.sh
  • This version of the StandaloneViewer has some scripts copied into it which enable the MultiplanarReformatting and VolumeRendering plugins by default.
  • Note: If you change anything in these scripts, you will need to run setupDevSite.sh again.
  1. Test the installation by loading one of the following URLs:

vtkplugin's People

Contributors

dominionsoftware avatar pieper avatar swederik avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

vtkplugin's Issues

Add debounced resize event handler

In OHIF we have a resize handler which is debounced to fire 100ms after resizing stops. This prevents needless re-computation / redraws while the browser is being resized (or the device is being rotated to a new orientation).

The VTK plugin should incorporate something similar. Somehow I think it makes more sense to implement this at the plugin level.

You can call volumeViewport.resize(), as is done here:

// TODO: VTK's canvas currently does not fill the viewport element
// after it has been resized. We need to set the height to 100% and
// trigger volumeViewer.resize() whenever things are resized.
// We might need to find a way to hook onto the OHIF Viewer ResizeManager
// div.querySelector('canvas').style.height = '100%';
volumeViewer.resize();

For reference: https://github.com/OHIF/Viewers/blob/master/Packages/ohif-viewerbase/client/lib/classes/ResizeViewportManager.js#L127

Error when loading plugin

Hello there,

I am running into this error when trying to load the plugin:

TypeError: Cannot read property 'getImageData' of undefined
    at VolumeRenderingPlugin.setupViewport (main.js?986.5500000305474:59)
    at 008a74a72da5af5b95bbc47fe6c1f8d714786336.js:175
    at Array.forEach (<anonymous>)
    at VolumeRenderingPlugin._initEmptyPluginViewports (008a74a72da5af5b95bbc47fe6c1f8d714786336.js:175)
    at 008a74a72da5af5b95bbc47fe6c1f8d714786336.js:175
    at t._compute (008a74a72da5af5b95bbc47fe6c1f8d714786336.js:49)
    at t._recompute (008a74a72da5af5b95bbc47fe6c1f8d714786336.js:49)
    at Object.s._runFlush (008a74a72da5af5b95bbc47fe6c1f8d714786336.js:49)
    at a (008a74a72da5af5b95bbc47fe6c1f8d714786336.js:1)

This error happened to me while developing locally but it also happens using the demo URL (https://vtk-plugin.ohif.org/?url=https://s3.eu-central-1.amazonaws.com/ohif-viewer/JSON/PTCTStudy.json) which I guess would make it easier to reproduce it. In the demo project, it happens when I click the "Volume rendering" tool.

I am new to OHIF and VTK so I am not sure what is going on. Could anyone give me a hand? Thank you.

Lost OHIF.plugins

first of all ,my english isn't very well.so sorry
I can't find out OHIF.plugins
need help

Multiple 3D textures instead viewports

I was testing this plugin to show MPR and VR and I saw that this plugin creates a 3D texture each time the user creates a view. So the problem is that to show MPR and VR the viewer loads some 3D textures instead of sharing them.

I was searching to share resources between contexts in WebGL but I just found workarounds like use one context with differents viewports. My question is if you have some plan like use some workarounds or you preffer to hold the multiple 3D texture load? (maybe I'm wrong, to test this I have just opened the chrome task manager and I looked the GPU memory usage and I have alerted that it increases if you use more views although it is the same texture)

Thanks!

Add Study/Series/Patient tags to the corners of the Viewport

We will want this plugin to fit into the application smoothly, so it should have the same UI by default. Some of these tags are meaningless for volume renderings, e.g. Img 1 (1/108), window / level, etc.., but the rest should remain the same. The plugin should render these into the DIV, they should not be provided by OHIF.

screenshot 2018-08-20 18 29 53

Use correct data type from Display Set for vtkDataArray

We are currently hardcoding the vtkDataArray to be backed by an Int16Array:

// TODO: Support all data types (UInt8Array, etc...)
const pixelArray = new Int16Array(xVoxels * yVoxels * zVoxels);
// TODO: Support numberOfComponents = 3 for RGB?
const scalarArray = vtk.Common.Core.vtkDataArray.newInstance({
name: "Pixels",
numberOfComponents: 1,
values: pixelArray,
});

We need to make this support the actual datatype provided with the display set metadata.

Problem with Slicing

The issue with incorrect slicing was caused by a misunderstanding of the vtk api. SetXSlice() requires a position not an index.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.