Style Editor
The GView Style Editor provides an intuitive, user-friendly graphical user interface for customizing genome maps. The style editor contains numerous options for quickly customizing the appearance of users’ genomic data without being overwhelmed by the complexity of GView’s Style Sheet (GSS) file format. Styling attributes such as colours or fonts for the various map elements can be adjusted in real time. Customized GSS files can be saved for later use or for application to other genome maps.
The style editor provides functionality for customizing, loading and saving styles, creating and removing styles from the workspace and seamless interchangeability and application of custom styles to genomic data. The user is able to hide or display the various map elements, add custom plots of data, add additional data sets and modify the appearance of all map elements.
The GView Style Editor is a user friendly GUI editor that enables users of GView to quickly and easily customize the appearance of their genomic data. The added functionality of the style editor enables a much greater audience to use GView to its maximum potential.
The style editor may be accessed by selecting Style >> Style Editor from GView's menu. The style editor may also be accessed by using the Ctrl + E hotkey combination.
The style editor may be closed either by closing the window or by selecting File >> Exit from the style editor menu.
The style editor is navigated via the use of a tree structure. Nodes may be selected and expanded to reveal child nodes. When a node is selected, the corresponding styling elements will be displayed on the right side of the style editor for modification. Right clicking these tree nodes will reveal appropriate options for the node and allow users to add and remove tree nodes.
It is possible for multiple nodes within the style editor to be selected by using either the Ctrl or Shift key and clicking the nodes. If the selection is composed of more than one tree node and the selection is homogeneous, then the styling elements on the right side of the style editor will be blank. Any changes to these individual blank styling elements will propagate the corresponding styling elements of all selected elements.
It is possible to use the Selection menu to facilitate easier multiple selection of tree nodes:
- Select All ... is used to select all nodes of a given type.
- Select Within ... is used to select all nodes of a given type that are already part of the current selection or are descendants of currently selected nodes. An example of this functionality would be when you wish to select all set nodes that exist within specific slots. This is accomplished by selecting the specific slot nodes and then selecting Selection >> Select Within ... >> Sets.
- Select Linked Sets is used to select all sets nodes that are linked with nodes in the current selection. An example of this functionality would be when you wish to select all set nodes that are linked with a specific number of legend texts. This is accomplished by selecting the specific legend text nodes and the selecting Selection >> Select Within ... >> Select Linked Sets.
A GView style is a collection of styling attributes and properties that are used to customize the appearance of users' genomic information. Styles may be created, removed, customized, saved and loaded from within the style editor. A single style may be applied to any number of genome maps.
A new style may be created by pressing the New Style button or by selecting either:
- File >> New >> Blank Style: This will create a new empty style with no slots or features specified and automatically set it as the current style. The style will be automatically named.
- File >> New >> Default Style: This will create a new style with default style attributes and automatically set it as the current style. The style will be automatically named.
The current style may be removed by pressing the Remove Style button on the style editor toolbar. This will only work if there exists another style in the workspace. You may not delete the last style. This action cannot be undone.
Any modifications to the current style may be applied to the GView map object by pressing the the Apply or Ok buttons from with the style editor. This will cause the GView map to rebuild with all changes taken affect. This will automatically apply all the changes to the style made in the current running instance of GView, but will not save anything to a file.
A saved style may be loaded by pressing the Open Style button or by selecting File >> Open from the style editor menu. This will prompt the user to select the *.gss file they want to load and the loaded file will be automatically placed into the workspace and loaded as the current style.
A style may be saved to file by pressing the Save Style button or by selecting File >> Save from the style editor menu. This will prompt the user to select what to name the *.gss file and where to save it.
There are two ways to switch the current style. From within the style editor, the current style may be selected from the Current Style drop-down combo box. The currently active style's name is displayed in the drop-down combo box. The current style may also be changed by selecting a style from the Styles sub menu in the Style menu in GView. The current style will have a mark beside it, denoting that it is currently active.
The current style may be renamed by selecting Style >> Rename Style from the style editor menu. Styles will also automatically be renamed when saved to reflect their new file name.
The global style panel contains style properties that effect the entire genome map, such as the background color of the genome map.
| Property | Effect | Example / Valid Input |
|---|---|---|
| Background Color | The color of the background. | [Color] |
| Slot Spacing | The amount of space between all slots. | Number >= 0 |
The backbone style panel contains style properties that effect the appearance of the backbone, such as the backbone thickness.
| Property | Effect | Example / Valid Input |
|---|---|---|
| Color | The color of the backbone. | [Color] |
| Thickness | The thickness of the backbone. | Number >= 0 |
There are two legend components: the Legend Boxes and their Legend Texts. Legend Boxes represent the legend as a whole and determine where the legend will appear and what overall appearance it will have. Legend Texts represent the items that exist within the legend.
The legend box panel contains style properties that effect the appearance of the overall legend, such as its location on the map.
| Property | Effect | Example / Valid Input |
|---|---|---|
| Background Color | The background color of the legend. | [Color] |
| Border Color | The color of the legend's border. | [Color] |
| Alignment | The position of the legend with regards to the genome map. | "Upper Right" |
The legend text style panel contains style properties that effect the appearance of the individual legend items, such as the text color & size.
| Property | Effect | Example / Valid Input |
|---|---|---|
| Text | The text of the legend item. | "this is sample text" |
| Show Swatch | Whether or not to show the legend item's swatch. | [boolean: yes/no] |
| Swatch Color | The color of the legend item's swatch. | [Color] |
| Text Color | The color of the legend item's text. This will override the parent legend style's text color. | [Color] |
| Font Family | The font family of the legend item's text. This overrides the parent legend style's font family. | "Serif" |
| Font Style | The font style of the legend item's text. This overrides the parent legend style's font style. | "Plain" |
| Font Size | The font size of the legend item's text. This overrides the parent legend style's font size. | Integer >= 0 |
The ruler style panel contains style properties that effect the appearance of the ruler, such as the font size and style. The ruler appears both inside of the innermost slot and outside the outermost slot.
| Property | Effect | Example / Valid Input |
|---|---|---|
| Major Tick Color | The color of the major ruler tick marks. | [Color] |
| Minor Tick Color | The color of the minor ruler tick marks. | [Color] |
| Label Color | The text color of the ruler labels. | [Color] |
| Label Background Color | The background color of the ruler labels. | [Color] |
| Label Font Family | The font family of the ruler labels. | "Serif" |
| Label Font Style | The font style of the ruler labels. | "Plain" |
| Label Font Size | The font size of the ruler labels. | Integer >= 0 |
| Major Tick Length | The length of the major ruler tick marks. | Number >= 0 |
| Minor Tick Length | The length of the minor ruler tick marks. | Number >= 0 |
| Tick Density | The density of the ruler tick marks. | [0.0 - 1.0] |
| Tick Thickness | The thickness of the ruler tick marks. | Number >= 0 |
| Tick Effect | The visual effect of the ruler tick marks. | "standard" |
| Label Placement | The placement of the ruler labels. | "below" |
The tooltip style panel contains style properties that effect the appearance of the tooltip, such as the text and background colors. The tooltip is what appears when a feature on the map is moused over. The contents of tooltips is determined individually by the features, such as sets.
| Property | Effect | Example / Valid Input |
|---|---|---|
| Text Color | The color of the tooltip text. | [Color] |
| Outline Color | The color of the tooltip pop-up box outline. | [Color] |
| Background Color | The color of the tooltip pop-up box background. | [Color] |
| Font Family | The font family of the tooltip text. | "Serif" |
| Font Style | The font style of the tooltip text. | "Plain" |
| Font Size | The font size of the tooltip text. | Integer >= 0 |
The slot style panel contains style properties that effect the appearance of the individual slots, such as the slot thickness. The individual slot style properties effect only the slot they correspond with.
| Property | Effect | Example / Valid Input |
|---|---|---|
| Thickness | The thickness of the slot; the thicker the slot, the bigger it will be. | Number >= 0 |
A slot is a track that exists adjacent to the backbone node. Slots may contain any number of feature sets or a single plot type. Slots may have either a positive or negative track number. The Backbone Slot is a representation of the backbone, to allow for easier drag and drop functionality.
Creating Slots
Slots may be created either by right clicking the Slots node in the style tree and selecting New Slot or by selecting Style >> New >> Slot from within the style editor. You will be prompted for a slot number. A valid slot number is any non-zero integer within the range of the current slots plus one, on either side.
Example:
| Current Slot Numbers | Valid Slot Numbers |
|---|---|
| No Slots | -1, 1 |
| -1 | -2, -1, 1 |
| -1, 1, 2, 3 | -2, -1, 1, 2, 3, 4 |
The newly created slot will appear as a child of the Slots node. If a slot existed with the same slot number before creation, it will have been pushed away from the backbone slot appropriately.
Removing Slots
Slots may be removed by right clicking them and selecting Remove Slot. If the removed slot is not one of the outer slots, then the surrounding slots with collapse inwards towards the backbone slot as appropriate.
Slots may be moved by dragging and dropping the individual slot nodes and arranging them as appropriate.
The set style panel contains style properties that effect the appearance of the individual sets, such as the set's color. The individual set style properties effect only the set they correspond to.
| Property | Effect | Example / Valid Input |
|---|---|---|
| Color | The color of the features in the set. This will be overridden by any subsets' own color. | [Color] |
| Thickness Proportion | The proportional thickness of the set. This is proportional to the parent slot's thickness. | [0.0 - 1.0] |
| Tooltip Text | The content of the text for the set's tooltips. This will be overridden by any subsets' own tooltip text. | "location" |
| Feature Shape | The shape of the features within the set. This will be overridden by any subsets' own feature shape. | "block" |
| Feature Effect | The visual effect of the features within the set. This will be overridden by any subsets' own feature effect. | "standard" |
A feature set represents a set of genomic features, determined by a feature filter, and is placed on either another feature set or a slot.
Creating Feature Sets
A feature set may be created under either a slot or as a subset of another feature set. To create a feature set, first select either a slot with no plot or a feature set and either select Style >> New >> Set from the style editor menu or right click the slot or feature set and select New Set from the right click menu. You will be prompted to define the feature set's feature filter at this time. The feature filter will determine which genomic features will be accepted in the feature set.
Removing Feature Sets
To remove a feature set, right click the feature set and select Remove Set from the menu.
The label style panel contains style properties that effect the appearance of the labels of the features the label style panel corresponds with. The individual label style panels effect only the labels they correspond with.
| Property | Effect | Example / Valid Input |
|---|---|---|
| Show Labels | Whether or not to show labels for the given slot / set. | [boolean: yes/no] |
| Lock Colors | Whether or not to lock the label colors to match to set they are associated with. | [boolean: yes/no] |
| Text Color | The color of the label text. | [Color] |
| Background Color | The color of the labels' background. | [Color] |
| Label Text | The content of the text of the labels. Similar to tooltip text. | "location" |
| Font Family | The font family of the label text. | "Serif" |
| Font Style | The font style of the label text. | "Plain" |
| Font Size | The font size of the label text. | Integer >= 0 |
The plot style panel contains style properties that effect the appearance of a given plot. A plot may be either a GC content plot, GC skew plot or either a data range or point plot. A plot may only exist in a slot that contains no feature sets or other plots. Feature sets may not be added to slots that already contain plots.
| Property | Effect | Example / Valid Input |
|---|---|---|
| Data | The data type of the plot. | "GC Content" |
| File | The data file to acquire plot information from. Not always required. | "/home/user/filename.csv" |
| Type | The type or style of plot, such as a line plot or a bar plot. | "line" |
| Grid Lines | The number of grid lines in the plot. | Integer >= 0 |
| Grid Color | The color of the plot grid. | [Color] |
| Upper Color | The color of the upper portion of the plot. Applicable for all plots. | [Color] |
| Lower Color | The color of the lower portion of the plot. Applicable for GC Content & Skew plots. | [Color] |
| Auto Scale | Whether or not to auto scale the plot such that the max value of the plot is visually at the outer edge of the plot and the minimum value of the plot at the inner. | [boolean: yes/no] |
| Minimum | Whether or not to automatically scale the plot. This will make the minimum value of the plot the minimum possible value in data set, and similar for the maximum value. | -1 |
| Maximum | The maximum value of the plot as an integer. All higher values will be displayed as the maximum value. | 1 |
Creating Plots
A new plot may be created by either right clicking an empty slot node from the tree view and selecting New Plot or by selecting an empty slot node and selecting Style >> New >> Plot from the style editor menu. Removing Plots
A plot may be removed by right clicking the plot node from the tree and selecting Remove Plot.
The property mapper panel contains mappings of feature properties to styles.
| Property | Mapping |
|---|---|
| COG Category | Color |
| Score | Opacity |
Creating a Property Mapper
A property mapper may be added to a set by right clicking the set node from within the tree view and selecting New Property Mapper.
Removing a Property Mapper
A property mapper may be removed by right clicking the property mapper node from within the tree view and selecting Remove Property Mapper.
Adding a Property Mapping
Property mappings may be added by pressing the Add button and selecting a valid property mapping. Currently, there may be a single score to opacity mapping, or any number of valid COG category to color mappings. The COG category mappings may be auto populated if desired.
Modifying a Property Mapping
Property mappings may be modified by selecting the property mapping to modify and pressing the Modify button.
Removing a Property Mapping
Property mappings may be removed by selecting the property mapping to remove and pressing the Remove button.
A legend link is responsible for connecting a single legend text with one or more sets. A link is responsible for ensuring an changes made through the style editor to the swatch color of legend text or color of a set will propagate to all items it is linked with. If a linked legend text's swatch color is changed through the style editor, then all linked sets will have their set color updated automatically to match the changed color. If a linked set's set color is changed through the style editor, then the single linked legend text's swatch color and the linked sets' color will be updated automatically to match the changed color.
Creating a Link
A link may be created by selecting one legend text and at least one set, right clicking one of the selected items, and selecting Create Legend Link. This action will override any previous legend link that may have existed in any of the selected items with the new legend link.
Removing a Link
A link may be explicitly removed by selecting either a single linked node or multiple linked nodes, right click one of the selected nodes, and selecting Remove Legend Link(s).