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.

Show different tooltip on click of a bullet

Type demo

This demo shows how to create double-tooltips for series bullets. When hovered, bullet will display some content. When bullet is clicked it will display a permanent sticky tooltip with different information until clicked again.

Pre-hiding pie chart slices

Type tutorial

This short tutorial will show how to pre-hide individual slices of a pie chart, in this case ones that have zero value. Hiding a slice To a hide a slice on a pie series (or any other percent series for that matter), we need to call the hide() method of its data item. For example, […]

Fake bullet following the XY cursor

Type demo

This demo shows how we can dynamically show a simple Circle element instead of actual bullets on a lines series. The demo pre-creates a Circle element on chart, which will be used as a “bullet”. When cursor is moving across the chart, the series get their tooltipDataItem setting set dynamically. Whenever tooltipDataItem changes, an event […]

Toggling active state of a bullet

Type demo

This demo shows how we can toggle “active” state of a bullet by clicking on it. It works by creating an “active” state for the bullet’s circle. This state is triggered on clicked objects if they have their toggleKey: “active” set. It also uses an event to monitor changes for bullet circle’s active setting, to […]

Getting data items within cursor selection

Type tutorial

This tutorial will show how we can grab data items that fall within the selection of a cursor on a scatter (XYChart) chart. Setup Our chart setup will use a ValueAxis as its Y-axis, and a DateAxis for its X-axis, just so we can look at how we can extract selection boundaries for both types […]

Handling bullet masking

Type tutorial

This tutorial is a collection of techniques that can be used to tackle various approaches to masking of bullets on an XY chart. Default behavior By default, an XY chart will contain all plots, including bullets within its plot area. This means that if bullets extent beyond plot area edge, they’ll be cut off. Unmasking […]