ZoomCharts Documentation
NetChart.settings.style
Chart style settings.
Properties
An "all included" style function.
Parameters
all nodes that currently loaded on the chart
all links that are currently loaded on the chart
Return value
links and nodes that the style function has modified. Or null
to mark all objects as modified.
Properties
Which character is used to delimit multiple node or link classes in the class string for node and link data
Removed object fadeout time.
View section details
Items are small UI elements that provide extra information. Items are attached to nodes or links and can display a label, image or both.
View section details
Default link style.
See also
- Documentation: Style setting precedence
Link radius auto distribution method.
Valid values:- null - scaling disabled
- linear - distribute link radii linearly between min, max value of linkRadiusExtent
- logaritmic - distribute link radii logarithmically between min, max value of linkRadiusExtent.
View section details
The class rules to apply individual style for link subset. Use known CSS class definition practice. Define one or more classes by specifying name and style and apply those by node definition. If multiple classes applied separate them with space and class rules will cascade in order of class definition.
Link decorations are not painted if link is shorter than this.
Link decoration size calculated as a product of the link radius and scale factor. The value lower than linkDecorationMinSize will take no effect.
Link details like labels, items are hidden if link width in pixels is below this value.
Link details like labels, items are not rendered if chart zoom is below this value.
View section details
Additional style to apply when a link is hovered.
See also
- Documentation: Style setting precedence
Base node size of link label that scales with link size.
Link length auto distribution method.
Valid values:- null - scaling disabled
- linear - distribute link lengths linearly between min, max value of linkLengthExtent
- logaritmic - distribute link lengths logarithmically between min, max value of linkLengthExtent.
Min and max value of link length before zooming is applied.
Min and max value of link half-width before zooming is applied.
An object defining one or more functions used to calculate node rendering style. Structure: { 'rule1':function1(nodeObj), 'rule2':function2(nodeObj) } The functions are executed in lexicographic order whenever node data or links change. Each function can modify the nodeObj to add specific style elements.
View section details
Additional style to apply when link is selected.
See also the selection
property that is applied to selected nodes and links.
See also
- Documentation: Style setting precedence
Link strength auto distribution method.
Valid values:- null - scaling disabled
- linear - distribute link strengths linearly between min, max value of linkStrengthExtent
- logaritmic - distribute link strengths logarithmically between min, max value of linkStrengthExtent.
Min and max value for link strength.
A a style function for links. Will be called whenever a link property or data has changed. Use to dynamically set link style fields.
Parameters
If the multilinks are curved, how much should they automatically curve away from each other. 0 for no curvature change, 1 for balanced curving away. More extreme or in between values can also be used.
Distance between multiple links between two nodes.
View section details
Default node style.
See also
- Documentation: Style setting precedence
Controls automatic node scaling. The radii are distributed in the range defined by nodeRadiusExtent
.
Valid values:
- null - scaling disabled
- linear - distribute node radii linearly
- logaritmic - distribute node radii logarithmicaly
- square - distribute node radii using square function
View section details
Additional style to apply for background nodes.
See also
- Documentation: Style setting precedence
View section details
The class rules to apply individual style for node subset. Use known CSS class definition practice. Define one or more classes by specifying name and style and apply those by node definition. If multiple classes applied separate them with space and class rules will cascade in order of class definition.
Node details like labels, items, images are hidden if node width in pixels is below this value.
Node details like labels, items, images are not rendered if chart zoom is below this value.
View section details
Additional style to apply when node is expanded.
See also
- Documentation: Style setting precedence
View section details
Additional style to apply when node is focused.
See also
- Documentation: Style setting precedence
View section details
Additional style to apply when a node is hovered.
See also
- Documentation: Style setting precedence
Base node size of node label that scales with node size.
View section details
Additional style to apply when a node position is locked.
See also
- Documentation: Style setting precedence
View section details
Additional style to apply when node data is not yet loaded.
See also
- Documentation: Style setting precedence
Min and max value of node radius, before zooming is applied. To use this, specify nodeAutoScaling
.
An object defining one or more functions used to calculate node rendering style.
See also
- Example: round image nodes
View section details
Additional style to apply when node is selected.
See also the selection
property that is applied to selected nodes and links.
See also
- Documentation: Style setting precedence
A a style function for nodes. Will be called whenever a node property or data has changed. Use to dynamically set node style fields.
Parameters
Color for fade out animation of removed objects.
Determines if link radius (width) is automatically scaled when the chart is zoomed in or out.
If set to null
, the value is inherited from scaleObjectsWithZoom
Determines if node radius is automatically scaled when the chart is zoomed in or out.
If scaleLinksWithZoom
is not set, this value also impacts links.
The common selection drawn for both links and nodes.
The difference between this and linkSelected
and nodeSelected
if that those are applied for each item
individually, while this selection
style is drawn as a background for all selected items. So if this
specifies a semi-transparent fill color, at no point will there be two overlapping selections visible -
instead one common background polygon will be drawn.
Properties
Specifies if the common selection style should be rendered. If this is set to false
, nodeSelected
and linkSelected
styles should be specified so that the selection can be visualized.
null
.The fill color of the selection shape. The default null
means that the same color as the chart background
will be used (assuming white
when transparent
is specified). The fill color is required if shadow color
is specified since otherwise the shadow might be invisible.
The outline color of the selection shape. Must be specified for the shadow to be rendered.
0.5
, for nodes the value is now affected by the zoom level.Specifies the size in pixels by which the shape size is increased. This value is further multiplied by the zoom level.
The multiplier by which the radius of node is increased to get the selection shape size. Value of 0.2 means that the size is increased by 20% (multiplied by 1.2).
The angle of the self-link in degrees. Limited to 0 < selfLinkAngle <= 90.
The "height" of the self links, how far away from the node center it will extend. This is a factor of the node radius. Must be positive.
The shape of the self-link. "Parabolic" makes sure the ends of the link point towards the center, but the self-link looks more "squished". "Quadratic" produces a more natural curve, but the ends of the link will not point at the center.
The "width" of the self links, how wide in parallel to the node it will extend. This is a factor of the default width, as determined by the shape. 1 is the default width. Must be non-negative.