Show “no data” warning on a chart

Type demo

This demo shows how we can use chart series’ davalidated event to display a “no data” message in a modal if data contains no items.

Grouping several series into single legend item

Type demo

This demo shows how we can selectively add series to legend, then toggle multiple series with a single legend item. The code uses series’ on() method to watch for changes in its visible setting, which is triggered when series is toggled via legend. It then hides or shows related series. It also uses series’ legendLabelText […]

Limit to single open branch in ForceDirectedSeries

Type demo

This demo shows how we can use setting-bound event to limit open branches in ForceDirectedSeries to one. The following code ensures that all open branches are collapsed, when another branch is expanded.

Show only one series at a time

Type demo

This demo shows how we can use series settings events to ensure only one series is shown on an XY chart at a time, by toggling off other series automatically.

One pulled slice per pie series

Type tutorial

Normally, when you click/tap a slice on a Pie chart, it would pull out a little. You can have multiple slices pulled out that way. This tutorial will show how you can set up Pie chart in order to allow only one slice to be pulled at any given time. Task We want the slice […]

Auto-adjusting chart height based on a number of data items

Type tutorial

This tutorial will explain how you can easily make your chart grow or contract based on an actual number of data. The problem Let’s take a simple bar chart: It looks OK. However, it height is fixed, so if we had more bars, it might start looking a bit awkward: Or, if there are too […]

Triggering bullet hover effects with chart cursor

Type demo

These are two demos that show how we can use chart cursor’s cursormoved event to trigger hover effects on multiple series’ bullets. Changing appearance of bullets This will make bullets grow larger on the category currently hovered by chart cursor. Showing on hover only In this demo, the bullets will be hidden except on the […]

Hide or relocate label bullets for small columns

Type tutorial

Sometimes, showing a label on a very small column is not an option. This tutorial will take a look at two ways to fix that issue. Hiding labels First option is to hide labels for small columns. We can use a private setting height change event handler to automatically hide or show the bullet based […]