Toggling multi-level Sunburst nodes with legend
Type
tutorial This demo shows how we can fix toggling of nodes in a multi-level Sunburst chart via legend using events. Code Example
Play series animations when chart scrolls into view
Type
tutorial This demo shows how we can trigger a replay of series’ animations when previously invisible chart scrolls into view.
Applying active state / highlighting all columns in a stack
Type
tutorial This demo shows how we can apply “active” state to all of the columns in a stack when one of them is clicked.
Syncing axis zooms across multiple charts
Type
tutorial This demo shows how we can sync zoom of an X-axes across multiple charts. Code The function that performs syncing: Using events to monitor changes to start and end settings on each axis: Demo
Complex bullets with hover effect
Type
tutorial This demo shows how we can create bullets out of several elements, as well as attach hover effects that trigger with both direct hovering by a pointer and with an XYCursor.
Position X-axis on zero-value
Type
tutorial Normally, the X-axis will be shown at the bottom of the plot container, regardless of the Y-axis scale. This tutorial shows how we can make the X-axis dynamically position itself so that it sticks to the position of the zero value. Code The idea is to watch for various events that could affect position of […]
Highlighting links of a force-directed node on hover
Type
tutorial This demo uses pointerover and pointerout events on force-directed series’ nodes, to automatically highlight all links going out of it. It makes use of an array of links contained in node’s data item’s links setting to automatically apply or remove “active” state. Code Demo
Aligning a legend with plot container
Type
tutorial This demo shows how we can use axis’ events to monitor its width, and automatically adjust position of the legend, so it is aligned perfectly with the plot area. Code Demo
Axis zoom end event
Type
tutorial This demo shows how we can use value change events of the start and end axis settings, as well as use debouncing techniques on the handlers to detect when the zoom animation has finished. Code Demo
Pie chart with a legend with dynamically-sized labels
Type
tutorial This demo shows how we can use events to dynamically set width for the Pie chart’s legend labels, so that the legend takes up all available space, left from the pie itself, as well as truncates the labels if there’s no space available.