Truncating legend labels

Type tutorial

Sometimes chart legend can get out of control size-wise, especially if you have long labels. This tutorial will show how you can get it back in check by capping the length of its labels. The problem Long labels will bloat up legend size. This is especially prominent where chart size is not very big: Even […]

Curved Pie Chart Labels

Type tutorial

Normally, labels for Pie chart’s slices are horizontal, and either arranged in columns or attached to the slice itself. This tutorial will show how you can make labels curve along the outer edge of the slice. Base chart Let’s take a super basic pie chart as our starting point. Making labels cool again To make […]

Hiding Small Pie Slices

Type tutorial

Pie chart sizes its slices proportionally, based on the relative values. Sometimes that means that we end up with a chart that has a bunch of small-value slices that are barely visible, but clutter up the chart. Here’s one chart like that: Ewww. Let’s see what we can do about it. Hiding labels Let’s hide […]

Variable-radius Pie Slices

Type tutorial

This short tutorial will explain how you can create a Pie chart that uses data to vary radius of individual slices. Base chart Let’s take this simple Pie chart as a basis for our further experiments. Introducing radius value Right now, the size of each slice represents a value and its relation to other values […]

Creating custom filters

Type tutorial

amCharts 4 comes with a few basic rudimentary filters like “drop shadow”, “desaturate”, and a few others. However, you can do much much more with SVG filters. This tutorial will explain how you can create your own custom amCharts 4-compatible filter classes. What is a Filter? SVG filters An SVG filter (represented by <filter> tag) […]

One pulled slice per Pie chart

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 […]

Overriding series’ tooltip fill color

Type tutorial

Normally, a Tooltip that is displayed when you hover or touch a series’ item – slice, column, etc. – is colored the same way as the related object. This quick tutorial will show you how to override that color. To turn off “inheritance” of color from related object, we can set getFillFromObject = falseĀ for the […]

Labels inside Pie chart slices

Type tutorial

Normally, Pie chart positions its slice labels in neat columns to the left and right of the pie. As a space-saving tip, this tutorial shows how to arrange them inside slices. Base chart Target functionality To achieve our target functionality, we’re going to do this: Place labels circularly around the pie; Remove ticks; Replace information […]

Pie chart with pre-pulled slice(s)

Type tutorial

If you would like your Pie chart to start off with one or more of its slices pulled out, there are a few ways to do so. This tutorial will show how. Base chart We’re going use a very basic Pie chart as our test subject. Next we’re going to examine two ways to make […]

Pre-hiding Pie Chart Slices

Type tutorial

Sometimes you will have a Pie chart with a lot of slices. This tutorial will teach how to automatically pre-hide some of them using “data fields” and data. Prerequisites Before we begin, let’s make sure we absolutely know how Pie series’ data fields work. To do so visit “Setting up series” section in our Pie […]