Department of Bioinformatics and Computational Biology

Home > Public Software > NG-CHM > Using > Interface

User Interface Overview

GO P ^

The NG-CHM Viewer is a web application with a feature-rich user interface. The high-level sections of the user interface are described below.

High level diagram of the user interface with sections labeled.

At a high level, the NG-CHM viewer consists of two main sections, the header section and the panel section.
The Header section can be farther divided into three smaller sections as described below.

Section Description
Header - Map Name The name assigned to the NG-CHM at build time.
Header - Search Controls Controls for searching for matching Row and/or Column Labels on the NG-CHM.
Header - Main Controls High level controls for the NG-CHM viewer.
Panels - Panel Area One or more panels that display the clustered heat map and related data.

Main Controls

The main controls at the top right of the viewer provide access to high-level controls for the NG-CHM Viewer software. Some of these controls, like the layers control will only appear if the current NG-CHM being viewed contains multiple layers of data.

Control Description
About Dialog
NG-CHM Options Menu
Heat Map Display Properties
Layer Controls

Here are details on each of the controls mentioned above.

About Dialog

The about dialog button brings up the “About” dialog box. Here you can access information about the viewer tool and project.

Item Description
NG-GHM Project Page Link to this documentation.
New and Updates Link to New and Update information for the NG-CHM Project.
Video Tutorials Link to Video Tutorials on YouTube.
Version Information Information on the current version of the software and NG-CHM.
Citation Information Citation Information for use when citing the use of the NG-CHM Viewer software in a publication.
Tour Button An automated tour of the various components of viewer based on the currently open map.
Download Viewer Button Link to download the current version of NG-CHM Viewer that can be used to view maps locally.
Show Keys Button Shows a list of the keyboard shortcuts available for navigating within the NG-CHM Viewer software. This information is also available via the Basic Navigation tab of this page. See the “Display Properties” tab on this page for detailed information.
Show Plugins Button Display a dialog of the current and available plugins accessible within the viewer. This information is also available on the plugins and linkouts page on this website.


NG-CHM Options Menu

The NG-CHM Options menu button provides access to high-level controls in the NG-CHM Viewer.

Control Menu Item Description
Open new heat map Allows you to open a new het map stored on your file system.
Save Heat Map As PDF Allows you to configure parameters to create a high-resolution view of the panels in the currently displayed NG-CHM and save them as a PDF file.
Download Thumbnail Download a thumbnail of the currently displayed NG-CHM.
Save Heat Map Changes Save the configuration and panel changes you have made to a local NG-CHM file that can be viewed in the NG-CHM viewer.
Modify Map Preferences Brings up the NG-CHM Heat Map Display Properties dialog which allows you to modify many of the properties of the currently viewed NG-CHM. This can also be accessed through the "Heat Map Display Properties" button.

Heat Map Display Properties

The Heat Map Display Properties button opens up a multi-tab dialog box that provides information on the map being viewed and tabs to control many of the options used to display various aspects of the NG-CHM. Detailed information on this dialog can be found in the “Display Properties” tab of this page.

Layer Controls

If an NG-CHM has multiple layers then the Layers Control will be displayed.

When activated, then another set of controls will be displayed that will allow the user to control which NG-CHM data layer is currently displayed on the summary and detail panels in the panels section of the map. These controls include a flick control that allows the user to quickly switch between two selected layers.

Control Description
Layer Control Button - shows/hides the controls below.
Dropdown Flick state up layer selection.
Dropdown Flick state down layer selection.
Flick control to determine which of the two layers selected above is displayed.

Search Controls

The Search Controls allow the user to search for values in the in the row and/or column labels of the main matrix in the NG-CHM. These work in conjunction with the search navigation controls in a HeatMap Detail Panel in the panel section of the map to select and navigate through matching items in the NG-CHM data. See the Search tab in this page for more detailed information.

Panel Area

The main portion of the user interface is the panel area. An NG-CHM will display one or more panels of various types in this section. By default, NG-CHMs will have a single detail panel on the left and a summary panel on the right. See the Panel Controls section of the Advanced tab on this page to learn how to use various panel controls provided by the NG-CHM Viewer.

Details on the plugins available can be accessed via the Plug-ins tab above.

Details on the linkouts available can be accessed via the Linkouts tab above.

Details on the types of panels supported in the viewer can be accessed via the Panels tab above.