Selectively positioning Sankey diagram labels

Type tutorial

It’s possible to selectively specify the location of Sankey diagram labels, based on the position of their parent Nodes. This tutorial will show how. Moving labels We’re going to use an adapter to dynamically change value of a label’s centerX setting. If the node is a left-most node (does not have any incoming links) we’ll position […]

Bubble chart with zoom in and out buttons

Type tutorial

This demo shows how we can add plus/minus buttons to a bubble chart that zoom in and out the chart. Code The code relies on adding custom buttons to chart plot container, as well as attaching click events to them, that in turn zoom the chart using axis’ API. Demo

Daisy-chain multiple chart rendering

Type tutorial

This tutorial shows how we can implement a simple daisy-chain to render multiple charts one at a time, with a custom delay. This approach might help ease the initial load on a chart-heavy pages. Implementing the queue The idea is this: instead of creating a chart instantly, we wrap it into a function and push […]

Selectively displaying pie chart labels inside or outside slices

Type tutorial

This demo shows how we can use an adapter on pie chart’s labels to automatically determine how it is displayed: inside or outside the slice. Code Example Here’s a simple example: Another example, which aligns outside labels into a column:

Focusable pie slices with perfect outline

Type tutorial

This demo shows how we can hide default rectangular bracket for focused pie slice as well as apply custom state to highlight focused one. Code CSS The following CSS will hide the built-in rectangular focus highlighter. Example