class %ZEN.SVGComponent.radialNavigator
extends svgComponent
This is a specialized SVG component that displays the relationship
between a set of data items as a radial diagram.
The data is displayed as a central circular hub surrounded by a set
of evenly spaced nodes. The number and contents of the nodes is specified
by an array of %ZEN.Auxiliary.radialNode objects.
parameter DEFAULTVIEWBOXHEIGHT = 100;
Default viewBoxHeight of this component.
This is set to 100 to provide a fixed coordinate system.
parameter DEFAULTVIEWBOXWIDTH = 100;
Default viewBoxWidth of this component.
This is set to 100 to provide a fixed coordinate system.
property backgroundStyle
as %ZEN.Datatype.svgStyle;
Optional: style used for background panel.
property hubStyle
as %ZEN.Datatype.svgStyle;
Optional: style applied to central hub.
property mainLabel
as %ZEN.Datatype.caption;
Label for central hub.
property mainLabelStyle
as %ZEN.Datatype.svgStyle;
Optional: style used for main hub label text.
property nodeStyle
as %ZEN.Datatype.svgStyle;
Optional: style applied to nodes.
property nodes
as list of %ZEN.Auxiliary.radialNode(XMLPROJECTION="ELEMENT",XMLREF=1,XMLTYPECONSTRAINT="CHOICE");
List of node information objects.
Each object specifies details about a node displayed by the Navigator.
property onselectNode
as %ZEN.Datatype.eventHandler;
onselectNode event handler:
This event is fired when the mouse is clicked on a Node.
When this event is invoked, the selectedIndex
will contain the index (0-based) of the current node. If the user clicks on the central node then
selectedIndex will be -1;
property selectedIndex
as %ZEN.Datatype.integer [ InitialExpression = -2 ];
Index (0-based) of selected node.
-1 means that the central node is selected.
-2 means that no node is selected.
property title
as %ZEN.Datatype.caption;
Title displayed by navigator.
property titleStyle
as %ZEN.Datatype.svgStyle;
Optional: style used for title text.
method appendNode(node)
[ Language = javascript ]
Append a new node object to this navigator.
The node object should be created by calling:
node = zenPage.createComponent('radialNode');
method clearNodes()
[ Language = javascript ]
Remove the set of nodes associated with this Navigator.
method drawConnector(group, angle)
[ Language = javascript ]
Draw a connector.
method drawNode(group, type, angle, node, num)
[ Language = javascript ]
Draw a node.
method getCurrNode()
[ Language = javascript ]
Return the current selected node object associated with this Navigator.
method getNode(index)
[ Language = javascript ]
Return a node object associated with this Navigator given its index
number (0-based).
method nodeClickHandler(evt, type, nodeIndex)
[ Language = javascript ]
Onclick handler for nodes.
method nodeMouseHandler(evt, flag, nodeIndex)
[ Language = javascript ]
Highlight/unhighlight node (called by mouseover, mouseout events).
method removeNode(index)
[ Language = javascript ]
Remove a node from this navigator.
index is the index number (0-based) of the node.
method renderContents()
[ Language = javascript ]
Render the inner SVG contents of this component.
method selectNode(index)
[ Language = javascript ]
Select the specified node.
method setProperty(property, value, value2)
[ Language = javascript ]
Set the value of a named property.