VariantsTree

The VariantsTree Control enables users to create and interact with a layered view. The view contains the following default layers:

• TreeVisualization
• GroupVisualization

The view is scalable. Context menus are supported.

The Constructor supports one composite parameter that can contain the properties described in the following table:

Name	Type	Description
connectId	String	Mandatory property. It contains the DOM element container ID for the VariantsTree control. The Element should exist in the document. The VariantsTree DOM will be placed as a child into container. The default is ‘variantsTreeContainer’.
layerVisualizationParameters	Object	Optional composite parameter. It contains a collection of additional visual settings for view layers, which can be loaded into view. Collection key = layer id. Example: { ‘groups’: { labelWidth: 200 } }

Name	Type	Description
layeredView	Object, MultiLayeredView	Reference to MultiLayeredView control. Most parts of the VariantsTree functionality are based on this core control. It is initialized in the constructor.

This section describes the public methods.

The loadtree method creates TreeLayer and GroupLayer instances, loads them into the control and then centers the view. The TreeLayer instance is initialized with the treeData input parameter. TreeLayer gets the ‘variantsTree’ ID and GroupLayer gets the ‘groups’ ID. The Method can be overridden in order to change the list of loaded layers. Input parameters

Name	Type	Description
treeData	Object	Hierarchical object data structure with a single root, where the next level children are placed into property children.

This method verifies that the default view layers are already created and loaded into the view control (loadTree method was called). Return value Boolean

Returns the SVG Node related to the control. Return value DOM Node

Allows the Groups layer to be either shown or hidden. Input parameters

Name	Type	Description
isVisible	Boolean	Required layer visibility state.

Sets new data for the layer. Input parameters

Name	Type	Description
layerId	String | Number	Layer id or index, which should be updated.
newData	Any	New layer data.

Gets count of leaf data items from TreeLayer. Return value Number of leafs.

Gets count of leaf data items from TreeLayer. Input parameters

Name	Type	Description
newScale	Number	Sets new scale value for layered view control.

Get count of leaf data items from TreeLayer. Return value Number

Sets new spacing value for Tree layer. This parameter effects distance between rendered item nodes, which are on adjacent hierarchy levels (horizontal distance). Input parameters

Name	Type	Description
spacingValue	Number	Spacing distance in pixels

Calculates and sets the optimal view scale when layers content fits client viewport.

Recalculates SVG node size based on current view content bounds and scale. This is a complex operation, which should be used after scaling or significant content changes.

The following sections describe the events that can be used as part of the VariantsTree Control.

Event fires when view scale is changed. Input parameters

Name	Type	Description
newScale	Number	Scale value that was applied.

Event fires when view scale is changed. Input parameters

Name	Type	Description
newScale	Number	Scale value that was applied.

The events described in this section belong to the dojo context menu widget. Use the dojo.connect and dojo.on modules to attach handlers for them.

Event handler for onMenuInit, which generates array of descriptors for all available context menu actions. Return value Array of menu items descriptors.

Event handler for setup context menu item’s state based on target layer and node. Input parameters

Name	Type	Description
menuControl	Object, MenuWidget	Menu control, which should be updated.
targetLayer	Object, VisualizationLayer	Layer that contains Node for which menu should be displayed.
targetDataNode	Object	Data object that bound to the target DOM Node.

Handler for onMenuItemClick event.
Input parameters

Name	Type	Description
commandId	String	Menu item id.
targetDataNode	Object	Data object that is bounded to the target DOM Node.