This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision Next revision Both sides next revision | ||
viewport [2022/02/07 17:17] yves |
viewport [2022/02/07 17:54] yves [Color control] |
||
---|---|---|---|
Line 2: | Line 2: | ||
PMA.core incorporates the [[https://www.pathomation.com/developers/#js|PMA.UI framework]], which includes a versatile viewport for control. | PMA.core incorporates the [[https://www.pathomation.com/developers/#js|PMA.UI framework]], which includes a versatile viewport for control. | ||
+ | |||
+ | {{ :viewport_pma_core.jpg?direct&400 |}} | ||
PMA.UI's viewport is web-based and independent; the front-end runs in the webbrowser of your choice. You can use it examine brighfield, fluorescent, and z-stacked slide content from the same environment. | PMA.UI's viewport is web-based and independent; the front-end runs in the webbrowser of your choice. You can use it examine brighfield, fluorescent, and z-stacked slide content from the same environment. | ||
- | The tile server ships with a default PMA.UI configuration. When embedded in downstream consumers like [[https://www.pathomation.com/pma.studio|PMA.studio]] or [[https://realdata.pathomation.com/whos-in-the-drivers-seat/|in custom scenarios]] and [[https://www.youtube.com/watch?v=0XtGaQ--eUc|analytical pipelines]] however, [[C:\Users\Yves\Pathomation Dropbox\products\wiki screenshots\pma.core\viewport_config.png|much more customization is possible]]. | + | The tile server ships with a default PMA.UI configuration. When embedded in downstream consumers like [[https://www.pathomation.com/pma.studio|PMA.studio]] or [[https://realdata.pathomation.com/whos-in-the-drivers-seat/|in custom scenarios]] and [[https://www.youtube.com/watch?v=0XtGaQ--eUc|analytical pipelines]] however, [[https://host.pathomation.com/sdk/pma.ui.examples/advanced_viewport.html|much more customization is possible]]. |
{{ ::viewport_config.jpg?direct&400 |}} | {{ ::viewport_config.jpg?direct&400 |}} | ||
Line 11: | Line 13: | ||
==== Getting around ==== | ==== Getting around ==== | ||
+ | Use the arrow keys on your keyboard to move around | ||
+ | {{ ::viewport_panning1.png?direct&400 |}} | ||
+ | |||
+ | Click on the left mouse button, and move the mouse around, to move the slide around, too. | ||
+ | |||
+ | {{ ::viewport_panning2.png?direct&400 |}} | ||
+ | |||
+ | If you want to navigate somewhere quick, click anywhere in the overview image to immediately jump to that particular area at the current magnification. | ||
+ | |||
+ | {{ ::viewport_panning3.png?direct&400 |}} | ||
+ | |||
+ | If you want to rotate a slide, use Alt + mouse movements. Alternatively, use the rotation widget in the bottom left of the screen for simpler mouse control, or to enter very precise rotation angles. | ||
+ | |||
+ | {{ ::viewport_panning4.png?direct&400 |}} | ||
==== Zooming in ==== | ==== Zooming in ==== | ||
==== Keeping track ==== | ==== Keeping track ==== | ||
- | ==== Color control ==== | + | The thumbnail widget has a special button that allows you to track your progress throughout a slide: |
+ | |||
+ | {{ ::viewport_tracking.png?direct&200 |}} | ||
+ | |||
+ | Once enabled, a gray overlay covers your slide's thumbnail, with pieces of it gradually disappearing, as you start navigating your side. The zoomlevel at which you inspect a specific region of interest, influences the outline color in the tracking screen. | ||
+ | |||
+ | {{ :viewport_tracking2.png?direct&400 |}} | ||
+ | |||
+ | This kind of tracking is instantaneous and ad-hoc. When you close the viewport, it disappears, and its history is not logged. If you're interested in tracking viewing operations over time and across your use population, you should have a look at the [[heatmap]] functionality instead. | ||
+ | ==== Color correction ==== | ||
+ | |||
+ | The default PMA.UI representation in PMA.core shows a color correction widget in the top-right corner of the viewport. | ||
+ | |||
+ | {{ ::viewport_color_correction.png?direct&400 |}} | ||
+ | Use it to control brightness, contrast, and gamma correction. | ||
==== Fluorescent content ==== | ==== Fluorescent content ==== | ||