Multi-series shared tooltip with colored bullets

Type demo

This demo shows how we can use an adapter for series’ tooltipText property, in-line text formatting, and cursor’s maxTooltipDistance to build a single universal tooltip that displays values from all series, complete with colored bullets. For more information, make sure you visit related tutorials for mentioned functionality: Adapters In-line string formatting Limiting number of series […]

Custom external legend

Type demo

This demo shows how we can use some custom code executed on chart load to build completely custom but interactive HTML-based legend for our chart.

Show column tooltip on category hover

Type demo

This demo shows how we have use “over” and “out” events on axis labels as well as chart cursor’s triggerMove() method to trigger tooltips on columns of the hovered category label.

Simulating individual order of columns within categories

Type demo

This demo will show how you can simulate an order of columns from different ColumnSeries within each category. It uses the following things to achieve it: Each ColumnSeries has clustered = false set so that it always takes up the whole width of the “hidden” categories. Data is manipulated so that each category contains only […]

Display tooltip on PieChart slice click

Type demo

Normally, tooltips on PieChart slices are shown when they are hovered by a cursor. This demo will show how we can disable this default behavior and only show tooltip when slice is tapped or clicked.

Disabling SankeyDiagram initial animation

Type tutorial

This supershort tutorial will show how to disable SankeyDiagram’s initial “fold-out” animation. Disabling animation If you have “animated” theme enabled, SankeyDiagram will fold out its nodes from left to right when it first loads. For that specific animation, it uses its interpolationDuration setting. So, to make the nodes appear instantly, all we have to do […]

Axis labels at arbitrary values on GaugeChart

Type demo

Normally, an axis on a GaugeChart will place labels at convenient intervals – so they are not too crammed and not too sparse. It will depend on actual chart size. However, in some case you might want to place labels at exact values, no matter what. This demo will show how you can disable axis […]

Clickable chart thumbnails

Type demo

This demo shows how we can use a custom function to defer chart instantiation and replace them with a thumbnail, which once clicked would be automatically replaced with a real chart.