DRAFT - feat(3DViewportPresets): 3D Volume Viewport Presets and Cinematic Rendering

[IbrahimCSAE]

trafficstars

Context

This adds 3D volume presets for the 3D volume viewport. It's accessible in the window-level action menu.

Changes & Results

• VolumeLighting Component
• VolumeMappingRange Component
• VolumeQuality Component
• VolumeRenderingOptions Component
• VolumeRenderingPresets Component
• VolumeRenderingPresetsContent Component
• VolumeShade Component
• Draggable Modal
• Labels for input range
• Customization service for viewport presets
• Customization service for viewport quality
• setViewportPreset command
• setVolumeQuality Command
• setVolumeMappingRange Command
• support for PNG in Icon component

Screenshots

[codecov[bot]]

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 44.41%. Comparing base (fad70e4) to head (f45cb1f).

Additional details and impacted files

@@                  Coverage Diff                   @@
##           feat/new-window-level    #3977   +/-   ##
======================================================
  Coverage                  44.41%   44.41%           
======================================================
  Files                         80       80           
  Lines                       1333     1333           
  Branches                     327      327           
======================================================
  Hits                         592      592           
  Misses                       588      588           
  Partials                     153      153           

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update fad70e4...f45cb1f. Read the comment docs.

[sedghi]

Noice let me review

[IbrahimCSAE]

Volume Quality, Shift, and Width are complete

Pending is Shade/Ambient/Diffuse/Specular

[IbrahimCSAE]

I requested designs from dan for:

• window level icon positioning
• gap removal at the bottom of the viewport
• scrollbar position
• colorbar position and style in single and dual mode
• window level icon for inverted pt

The OHIF icon is svg, so I'm not sure, this the icon I got from Dan.

I added some fixes and you can try it out now, I also addressed the comments

http://localhost:3000/viewer?StudyInstanceUIDs=2.16.840.1.114362.1.11972228.22789312658.616067305.306.2&hangingprotocolid=mprAnd3DVolumeViewport

[sedghi]

This icons doesn't look right, they seem smaller than expected

---

Also when i load the menu for 3d preset, seems like some times it takes time to actually render the icon, can we use preloaders or something to make sure they load quickly enough? (not important, but the solution might be easy if you search)

https://github.com/OHIF/Viewers/assets/7490180/3289cc7f-45b3-44e6-b79b-4806c1d0ed22

---

I don't think the click outside rendering presets should close it, ask Dan, but I expect the user to want to rotate the view before closing either by X or Cancel, ask Dan

---

Still feels like the text is too thin, ask Dan to evaluate if a higher weight looks better

---

There is this unusuall move if you drag a thumbnail accidently

https://github.com/OHIF/Viewers/assets/7490180/905330d2-8880-45e5-a5eb-29ebc17048ca

---

Shift and width are not doing as expected, see below for a correct implementation in 3D slicer, maybe we just put shift slider similar to 3D slicer

https://share.cleanshot.com/GmD1d0fN

[IbrahimCSAE]

I updated design, reimplemented shift, and removed width.

modal is also now draggable only from header

[IbrahimCSAE]

@sedghi if there's design adjustments to be made again, no problem but lets merge this into the actual new-window-level branch and I'll continue there, I'm doing general changes for colorbar and other stuff that shouldn't be here.

[IbrahimCSAE]

I made clicking the thumbnail apply the preset and removed the apply button. I was just following the design from Dan, it had an apply button that's why.

I also made the area behind the modal clickable now, you can rotate the viewport or do other actions.

For the shift slider, I'm not sure how we can make a custom range so the entirety of the slider is useful, because all presets are different. I tried slicer 3D and volview and they do have the same thing where a part of the slider feels like it's useless. If you have a fix or a way to do it let me know an I will.

@sedghi